Fejlesztése webes alkalmazások 2
Jack Harrington. Senior Software Engineer, Studio B
DHTML: érvek és ellenérvek
Íme néhány javaslat:
1. lista mutatja a kódot ezen az oldalon.
Sok a végzett munka ebben a példában a CSS segítségével. A CSS helyzetben tulajdonság. lehet elhelyezni az oldal tetején mezőbe. Az attribútumok és bal felső van az elem képest a lap bal felső sarokban.
pop-up
Egy másik típusú mobil ablakok - egy felugró ablakban. Használhatja a pop-up, hogy további információkat, ha a felhasználó kéri. Tekintsük a szöveg, mint a 3. ábrán látható.
3. ábra Egy egyszerű szöveges oldal az állatokról
Hát nem jobb, ha a felhasználó megismerkedik egy zsiráf? A szöveg tartalmaz egy praktikus kapcsolat: ha ezt választja, akkor megjelenik egy pop-up ablak a 4. ábrán látható.
Itt meg tudja nyitni az ablakot kérésre, és helyezze a szöveg a dokumentumban. A kód a 3. listában.
3. lista A felugró ablakban a HTML
Szabhatja a tartalmát a felugró ablakban, mielőtt láthatóvá válik azáltal innerHTML tagja az objektum felugró
Elég kompatibilis kódot. Azonban előfordulhat, hogy következetlenségek miatt értékbeli különbségek és offsetLeft offsetTop származó böngésző böngésző, különösen a lapok komplex beágyazott tartalmat. Ahhoz, hogy pontosabb pozíció olvasása közben egy komplex oldalt, akkor lehet, hogy rekurzív hozzá a offsetLeft és offsetTop. Segítségével offsetParent objektumot kap a szülő minden objektum, ahogy felfelé a fa HTML tárgyakat.
Pop-up PHP
Miután a kódot DHTML, könnyebb lesz használni a pop-up PHP alkalmazásokban. PHP kód látható a 4. listában.
Listing 4 PHP kódot felugró ablakban
Itt megoszthatja a fejléc generálása és elhelyezését minden pop-up ablakban. Az oldal ne okozzon popup_header belső tag fejét. majd adjuk hozzá a címkét
Ez a PHP függvény felugró három paramétert: az azonosító felugró ablak egy egyszerű változata a szöveg és a szöveg kialakulni, amikor az elem ki van választva. A funkció akkor generál egy képet a horgony tag, amely úgy néz ki majdnem pontosan olyan, mint az eredeti változat DHTML.
Egy másik lehetőség, hogy elrejtse, és megjeleníti az adatokat az oldalon - ez ellen. Ebben a modellben az oldal két részre oszlik, amelyek rejtett vagy külön-külön feltüntetve a számláló. Az 5. ábra egy oldalt a két rész a számláló, amelyek mindegyike kezdetben zárva van.
5. ábra szakasz page counters zárva
Válassza a Nyitott linkeket a Level One rész megjeleníti a tartalmát ebben a szakaszban, a 6. ábrán látható.
6. ábra: az oldal nyitott első számlálónak
Ahelyett, hogy a szavak nyitott és zárt, akkor a grafikus objektumok. Hagyományosan ezek a grafikák általában háromszögek azt jelzik, hogy a megfelelő zárt. vagy lefelé, hogy nyissa ki; vagy plusz vagy mínusz jel, ahol plusz eszközökkel zárva. és mínusz - nyitva. (Vélemények melyik megközelítés a jobb, megy vissza a vita a Mac és Windows. Méter két platformon megfelelnek az két különböző lehetőséget.)
A kód az 5. lista mutatja, hogy ezek méter működik:
5. lista Counter HTML
számláló mechanizmust vezetnek be a spin funkciót. amely figyelembe veszi a láthatóságát a mérő test és megfordítja azt, a változó látható rejtett és rejtett látható.
Te meg a magasságot attribútum 0px. amikor az elem nem látható, és az automatikus -, amikor azt látjuk. Az Internet Explorer, ha az elem nem látható, a környező területet összenyomódik. De a Firefox, ha a tartalom nem látható, van egy üres hely is. Be kell állítani a magasságot 0px. hogy a tér húzva.
Használja a grafikus szöveg helyett, hogy kifejezze a nyitott vagy zárt állapotban, hogy változtassa meg a kódot, amely megváltoztatja az értékét innerHTML számlálóobjektum kiválasztásához tag-kép helyett szöveges címkét.
Számlálók PHP
Elvégzésére számláló PHP, akkor kövesse a standard modell létrehozása DHTML kódot szerver termékek, megállapítva szegmensei HTML a funkciók az elején és a végén. PHP kód listán látható 6.
Listing 6. Counter PHP
Minden tartalom rész zárójelbe egy hívást, hogy start_spinner és end_spinner. start_spinner függvény figyelembe veszi két paramétert: Meter ID és a cím. Hívjon end_spinner záró címke
Lehet tenni a tartalmát a pultra, a harmadik érv. De gyakran ezek tartalmi szakaszokból állnak egymással, és ha te írtad, hogy így, a felület kellemetlen lenne használható. Ez a modell a következtetést tartalmának dinamikus szakasz funkció a „start” és „vége” azt jelenti, hogy a PHP között lehet olyan bonyolult, mint szeretné.
7. ábra: A játék, név szerint rendezve
Hogy a játék szerint rendezve fiókkal, kattintson a linkre By mutatóját. A lista változni fog, ahogy a 8. ábrán látható.
8. ábra: A játék sorrendje számla
Ahelyett, hogy az összetett válogatás a kliens oldalon, az oldal használ egyenértékű flash kártyák: Egy kártya tartalmaz egy listát, név szerint rendezve, a másik - egy sorban. Válogatás a linkeket rejt egy-egy kártyát, és megmutatja a másik. A kód látható a 7. példában.
Listing 7. Könyvjelzők HTML
Is sor kerül még néhány érdekes dolgot. Először is, dinamikusan változtatni a CSS osztály, a className attribútumot. Így a kiválasztott gomb fehérről feketére.
Másodszor, meg a CSS nevek és a pontszámot. mindkét
Ez a fajta meglehetősen bonyolult lesz és érdekes, ezenkívül kompatibilis szinte minden modern böngésző.
Könyvjelzők PHP
Egy másik eszköz a fejlődő DHTML PHP használata kimeneti pufferelés. A pufferek kimenet tárolja a szöveget, címkéket és ismételje anyag az oldalt, és visszatér, mint egy húr későbbi felhasználásra. Ahhoz, hogy hajtsák végre a könyvjelzők használata kimeneti pufferelés tárolja a tartalmát a lap, mint egy húr, mielőtt megjelenne, hogy az oldalra (lásd. Listing 8).
Listing 8. A könyvjelzők PHP
PHP kód kezdődik meghatározó két változó: fül és CURRENT_TAB. A tömb értékeit tartalmazza párbeszédpanel lapjai id. cím és html minden könyvjelzőt. CURRENT_TAB jelzi könyvjelző feltett közötti hívások start_tab és end_tab. start_tab függvény figyelembe veszi a két paraméter: az érték az id értéke a könyvjelző, cím. Aztán elindul a kimenet pufferelés.
end_tab funkció leállítja a kimenet pufferelés, és tárolja a kapott értéket a HTML html CURRENT_TAB tömb lapokon.
Ha megnézzük tovább, látni fogja, hogy a függvény hívások és start_tab end_tab körül tartalmát könyvjelzők, ami megjelenik a lapon.
Fontos funkciók megjelenítésére könyvjelzők az oldalon vannak place_tab_buttons és place_tab_content. place_tab_buttons függvény létrehoz horgonycímkékre hogy ugyanaz a neve, mint a kedvencek és amely, ha a kiválasztott, kapcsoló lapok. place_tab_content függvény létrehoz címkék
Lásd még:
Get termékek és technológiák
- Frissítsd a következő fejlesztési projekt nyílt forráskódú IBM próbaszoftver. letölthető vagy DVD-n.