|
UZivatel, ktery se rozhodne pro dynamicke HTML (pro neznale : dynamicke HTML je vlastne HTML s podporou skript\i, stylu a absolutnim nzenim polohy) by mel pfedev§im vedet, Ze vYsledkemje ho snahym Ufe (a vetSinout o tak bYva)b Yt velmi efektni zpesti'enoi bsahua hlavne designoveU mvnes tranek.S tejnet ak tirilto mUfe vytvont str{mku,k terous i navMevrncjie ho stranek zobrazi bud' jen s velkjmi obtiZemi a nero vtibec. Mluvim 0 tom, ze v jinych prohliZeeich net je Microsoft Internet Explorer nejsou nektere nebo vsechny soucasti teto modernf technologie zobrazeni dat podporovany. Dnes v prnfm dilu povidani 0 modernich webovYch technologiich bych Vam chtel pomoci odpovedetn a par zasadnicho tlizek, ktere Vam pomohous rozhodovanimz da DHTML pouZit nebo fie. Co prina§i DHTML uiitecneho ? DynarnickeH TML brIo jiz od zaCatkuh lavnep rostfedkem,t edy ne zdrojem dat. Z toho vyplyva, ze pfinliSf zejmena zvY§en! designove urovne. Nektere veci delane v HTML vsak pnnliSi nejen hezkY vzhled ale take funkcnost. Jedna se napfiklad 0 menu, titulkove pruhy, napovedy, multimedialni systemy atd. Dynarnicke HTML pnnliSi jednoduche regen! pro ty , kteff si llimou hlavu s otazkouja k vyIepsit vzhled sv'!1chs tranek.O d dob kdy svetlo svetas patfilo HlML ubehloj iz par let a HTML je stalez llkladema alfou i omegoui nternetovehos veta.P rotoze ale pomalu prestavalo stacit data jen nejak na str{mku dostat a zobrazit, ale brio zapotfebi je tfidit a graficky upravovat vznikali postupne nove technologie. Prave takovou je DHTML. Omezeni DHTML spocivaji prave v jiz zminenea verzi DHTML vucijinym prohliZecfunn ezje Internet Explorer od Microsoftu. Faktem je, Ze finne Microsoft i roe patti jiz davno ryrazne vetsi podil nezje tomu tak u NetscapeN avigatoro. Ikdyz existuij stovky prohliZeCuje jich podil na trhuj e tak zanedbatelnyz, e nema,a lesponp odle mehon azoru,c enuu pravovats trfinkyv jlucne jen pro fie. Problememje,z e kaZdyp odporojen ecoj ineho a to v dtisledkuz namenaz, ej edna castd ynamickeho HTML by mohla jet i naj inem prohliZeCia, le dal§i cast uz fie, protoZev neron emap odporu.P otom str{mky nepracuji takjak maji a cele se to !van tak nejak "divne". Chcete-li tomu zabranit nabizim dye moine a nejcastejip ouZivanet echniky reseni.U pozometep orod moZnos ve nav~revm'kny a fakt, Zes trfinky budouz qbrazenyo ptimaInej en v InternetE xploreru,n ero svym ctenaffuns ve str{mkyo ptimalizujtei pro nejvice rozsffenyN etscapeN avigator. Pro ostatnip rohliZeceja ko je Opera nema cena strfinky optimalizovat, protoZe potom by jste meli patnact verzi stranky a bez pouZitin ejakep okrocilej~it echniky by zejmenaw ebmasterfuno sobnichs tranekb ehalm raz po zadech z aktualizaci... Jsemz asmncemp ouZiti DHTML i prest ento zminenyn edostatekN. ynejsi situacen a trhu vypadcti ak Zes ve strankys klidem v dumn apiStep ro Internet Explorer. Atkoliv je u Netscapes nahaz lepsit prohliZet a dostatj ej na UrovenI E, vYsledekp omd neni zda1ekata kovYj aky by mel by!' Hlavne fakt, ZeN etscapen epodporujem odem{t echnologieja ko je XML a DHTML jsou vaZnoup fekazkou rozvoje. Potfebuji DHTML ? Toto je zajimava otazka, protoze odpoved' na ni Dent jednoducha a zaIeZi pfipad od pfipadu. Nektere veci je lepe legit prostjm HTML, protoze je vjsledek pfehlednejsi a da se tim i snareu pravovat,a le hlavnep ine splnujep oZadavkyT. ak proc nepouZitH TML. Ve vetsinep fipadu ale pouZitim DHTML strankamp omtiZeteN. eznamm noho stninekk tere by bez DHTML vypadali lepe. Maximalne by vypadaly stejne dobfe a nero by byl zdrojovj k6d pfehlednejsi na Ukor vnejsmo vzhledus tranek.N ebojte se DHTML pouZit.I s malym kOdemD HTML vloZen)rmd o Vasich stranek muzeted osahnouet fektm'hov jsledku. Krasa DH1ML Dentj en v tom co umi, ale take v tomj ak to delft. ProtoZe se objekty a funkce DTHML ovladaji a skladaji ze skriptu (JScript, Java script) jsou deje navic i logicke. UdAlosti se fidi funkcemi, podminkami, operatory ...DHTML muzou pouZit jak profici tak i zacate~nicik, tefi maji znalosti HTML a chteji je ozivit necim novjm. Jak to vlastne funguje ? Dynamicke HTML pracujen a principu spolupraceH 1'ML se skriptovacimi technikami a multimedi!Inimi designovjmi technikami. Do teto kategorie bych zafadil i kask!dove styly jak se u nas fik! CSS. Pozdeji se Vas budu snaZit seznamit s novjmi momostmi CSS, ale dnes bych Vas chtel seznamit s vjstavbou strimky, ktera pouZiv! DHTML. 24.2.2002 Podivejte se na nasledujici ukazku DHTML reseni. Tento skript vloZi na stranku tlacitko, jehoz stisknutim stranku vytiskneme. Neberte tento pfikladjako neco pro zacatecniky. Pro zacatecniky rozhodne nelli, chci Vam hlavne ukazat vYstavbu stranky v DHTML. Pro ty zvidave -ve skriptu je pouZito obje~ 0 tom budu psat pozdeji pokud Vas zajimaji detaily. Uvedeny pfiklad najdete funkcni na !eto strance: <html> <head> <title>Strimka s pouZitim DHTML</title> </head> <body> 1<SCRIPTL anguage=J" avascript"> function printit{) { if (NS) { window.print{) ; } else { var WebBrowser = '<OBJECT ID="WebBrowserl" WIDTH=O HEIGHT=O CLASSID="CLSID:8856F961-340A-l1DO-A96B-OOCO4FD705A2"><IOBJECT>' document.body.insertAdjacentHTML('beforeEnWd',e bBrowser); WebBrowserl.ExecWB(6, 2);//Use a I vs. a 2 for a prompting dialog box WebBrowserl.outerHTML = ""; } } </script> <SCRIPT Language=" Javascript"> yarNS = (nayigator.appName = "Netscape"); var VERSION = parseInt(navigator .app Version); if (VERSION> 3) { document. write('<foffil><input type=button yalue="Print this Page" name="Print" onClick="printit O"></foffil>'); } </script> </body> </html> Pledchozi pfiklad toho s DHTML nema aZ tak moc spolecneho. Je v nem pouZita i metoda objektU ActiveX, ktera zacatecnikovi mnoho nefekne, v dalsich dilech serialu se 0 ni take zminim. To DHTML, ktere je zajimave pro zacatecnfka v modernich technologiich je videt v pouZiti skripro. Co je na tomto pfipade zajimave ? Pfedne je to fakt, Ze je to jedna z mala forem skripro DHTML, kterj je pouZitelny jak v Netscape Navigatoru tak v Internet Exploreru. Pojdfe a projdeme si cely skript od zacatku. Pomineme zakladnf macenf HTML a dostavame se k prvni nemame v~ci. Jedna se 0 vioZenY Java skript. Tag SCRIPT prohliZeei Tiki!, ze se bude zpmcovavat zdrojovY kOd skriptovaci techniky. Pammetr language Davie upresfiuje 0 jakj skript pujde. Skripm je vice, napt. JScript, Java script, VB script. Parametrem language upresnujeme jaky skriptovaci jazyk hodlame pouZit. 24.2.2002 Za tagem SCRIPT nasleduje naSe prvni funkce. Funkce je neco jako seznam Ukolu, ktere mate udelat a tyto jsou spustenyp redchozim etodou.D iky tomu lze funkce nastavitt ak aby se spustili po kliknuti na tlacitko, nactenis trimky, odchoduz e strimkya td. MoZnostip ouZiti funkci je nekonecnem noho. NaSe funkce ma i sve jmeno, protoZe kaZrla funkce musi mit sve jmeno aby brio jasne kterou funkci napf. kliknutim, chcete spustit. Ta na§e se jmenuje printitO. Nazev mUie bit sloZen prakticky z jakyhkoliv podporovanycha povolenychz nakU.R ikam povolenych,p rotoZen ejsoup ovoleny napfiklad matematicke znaky I, * ,-, +, a take znaky vyhrazene pro system. Za nazvem funkce musi bit O. Funkce printit se sklaoo z podminky. Podminka IF je takovYm policistou, kterj hlida stay veci a podle toho jedna. Podminka fika, Ze pokud je stranka zobrazena v NN bude stranka vytistena pomoci pfikazu window.printO,jinakje volan objekt ActiveX, ale um se nyni nezabyvejme. Totoje pfiklad kdy pfi zobrazeni strlinky v NN bude volana niz~i, jednoduzsi funkce a pfi zobrazeni v Internet Exploreruje pouZita ponekud pokroCilej~i technika. Oboji ma za nasledek ale tu samou vec -stranka bude vytistena na uzivatelove tiskame. Za ukoncenim tagu </skript> je i konec prvniho skriptu pouZiteho na strance. Nasleduje dalsi skript, kter)' narozdil od toho prvniho neupravuje to co bude vykonano, ale kdy to bude vykonano. Ide 0 presne urCeni toho kdy se stane funkce printitO aktivni. Nejprve je pomoci pfikazu VaT tfeba definovat promene pouZite v pfikladu. V naSem pfipadu se jedna 0 promene, ktere urcuji 0 jaky typ prohliZece se jedna. V pfipade, ze se jedna 0 prohlizeC jehoz verze je vyssi nez 3 tj. Netcape Navigator i Internet Explorer 4.0 a vyssi, bude na strance zobrazeno tlacitko pro vytisknuti strfinky. Pokud fie, toto tlacitko se whec na strance neobjevi ! Ie to mome diky tomu, ze je tlacitko do strfinky vloZeno pomoci skriptoveho pfikazu document. write(). V zavorce je psan zdrojovy k6d cisteho HTML s tim, Ze k tlacitku je pomoci funkce onClick pnfazen Ukol zpracovat funkci printitO, kterou jsme defmovali v predchozim skriptu. Toto je typicky. pfiklad toho, Ze i kratk-y skript mUfe delat zajimave veci. Zopakujme si co vlastne dela krok po kroku. Nejdfive se do pameti nacre cely skript. Jsou definovanyp romenne.P okud vlastnitep rohliZecv erze4 .0 a vyssi buden a strancez obrazenotl acitko pro tisk. Pokudf ie. nebudez obrazenoB. a co vic. skript nebudez pracovan,p rotoZes tarSip rohliZeCe nepodporuji zpracovavani skriptu. Po tomto beh skriptu docasne skoncil. Ceka se na reakci uZivatele. Kdyz uZivatel stiskne tlacitko pro tisk rozbehne se dalsi funkce naseho skriptu, ktera jedna zase v zavislosti na verzi prohliZece jakou vlastni uZivatel -navstevnik Vasich stranek. Podle verze prohliZeces pustif unkci tisku, kteraj e v NetscapeN avigatoro dlisnao d InternetE xploreru. Timto clankem bych cht~l zahajit serial nejen 0 DHTML, ale postupn~ bych se chtel v~novat i jinym modemim technologiim. Propojeni stranek s daty, jazyk XML, distribucni techniky... Je tady misto pro Vas. V pnstim climku se seznamimeb liZe s CSSa jejich napojenimn a DHTML. ~ 24.2.2002
|