Hivatkozások :::::: Powered by: www.webtar.hu ::::::

<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns="http://www.w3.org/TR/REC-html40"> <link rel=File-List href="index_elemei/filelist.xml">  <style>  </style>  <body lang=HU link=blue vlink=purple style='tab-interval:35.4pt'> <div class=Section1> <p align=center style='text-align:center'><a name=Hivatkozások></a><a href="http://chaos.uw.hu/dreamweaver.htm"><span style='mso-bookmark:Hivatkozások'><span style='font-size:24.0pt;font-family:Arial'>Hivatkozások </span></span><span style='mso-bookmark:Hivatkozások'></span></a><span style='mso-bookmark:Hivatkozások'></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Hivatkozások (Linkek) segítségével különbözõ oldalakat tudunk összekapcsolni. A Linkek mintegy ugrópontként szolgálnak egy másik oldalra (esetleg egy bizonyos oldal egy adott pontjára, de léteznek teljesen más típusú linkek is). Lehetõségünk van mondandónkat oldalakra bontva, az oldalakat valamilyen rendszer szerint összefûzve elhelyezni az Interneten, ezáltal tagolva azt, és lehetõséget adva rá, annak, aki megtekinti, hogy ha õt bizonyos részek nem érdeklik, ne kelljen azt megnéznie.<br> Hivatkozásokká alakíthatunk szövegeket, képeket, képek bizonyos területeit (ill. a felhasználó ténykedésére létrejövõ eseményeket, de errõl majd késõbb).<br> Az ugrópont (kép, szöveg, stb.) tualjdonságaként kell megadnunk a Link pont alatt annak a dokumentumnak az Internet címét, amire az ugrópontunk visz.<br> Linkek természetesen mutathatnak nem csak weboldalakra (*.htm, *.html file-ok), hanem bármilyen file-ra is, ebben az esetben, ha a felhasználó böngészõje nem tud mit kezdeni az adott dologgal, felkínálja, hogy a felhasználó letöltse azt.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Internet címek felépítése (URL-ek)</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Protokol (pl.: http)<br> - Hely (pl.: www.avix.hu)<br> - Dokumentum elhelyezkedése (/ie/) - tulajdonképpen mint egy könyvtárszerkezet.<br> - Dokumentum neve (index.htm) </span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Pl.: http://www.avix.hu/ie/index.htm</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Protokol: Ennek segítségével dönti el a dokumentumot elkérõ program, hogy azt hogyan kell kezelnie.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Relatív és abszolút URL-ek:</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Abszolút URL:<br> Az Internet címet teljes egészében megadjuk (Különösen az oldalainkat tartalmazó webhelyen kívüli helyekre kialakított linkek használata esetén van értelme használatuknak). Pl.: www.avix.hu.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Relatív URL:<br> Nem adjuk meg a teljes Internet címet, csak az éppen aktuális dokumentumunkhoz képest az elérési útvonalat. Pl.: Ha a www.avix.hu/ie/index.htm-en vagyunk, és ugyanebben a könyvtárban (/ie/) van egy web.htm nevû dokumentum, akkor a relatív hivatkozás egyszerûen web.htm. Relatív hivatkozásokat csak az adott webhelyen belül található oldalakra kialakított linkek esetén tudunk alkalmazni.<br> A relatív link alkalmazásának elõnye, hogy mivel az elsõ oldal megnyitásához az útvonal adott, mindig ehhez történik a viszonyítás, ezért lényegében mindegy, hogy az oldal hol van, akkor is mûködõképes lesz (Tehát, ha mondjuk nem Neten, hanem otthon a merevlemezen tároljuk, akkor is mûködni fog).</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Szöveg, mint hivatkozás</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Egy szöveg hivatkozássá alakításához jelöljük ki az adott szövegrészt, majd a Link tulajdonsághoz írjuk be a megfelelõ dokumentum relatív, vagy abszolút Internet címét. Ilyenkor az adott szöveg aláhúzódik, illetve színt vált. Ezeket a színeket tudjuk beállítani a Page Properties Link, Visited Link ill. Active Link pontjainál.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Link: A még nem látogatott hivatkozások színe (Kék)<br> - Visited Link: A már látogatott hivatkozások színe (Lilás)<br> - Active Link: Az éppen töltõdõ link színe (Piros) </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Hivatkozások Elnevezett Horgonyokra (Named Anchors)</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Elnevezett horgonyok segítségével bizonyos pontokat jelölhetünk meg oldalainkon, ahova késõbb oda tudunk ugrani.<br> Létrehozásuk: Insert/Named Anchor, vagy az Objects palettán az Invisibles részbõl a horgony ikonra klikkelve illetve a dokumentumba húzva azt.<br> Minden ilyen horgony rendelkezik egy névvel. Maga a horgony a böngészõben nem látszik.</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Névadási szabályok: a különbözõ objektumok elnevezésére csak az angol abc betûit ill. számokat használunk, a név szóközt nem tartalmazhat, nem kezdõdhet számmal.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha egy ilyen horgonyra akarunk hivatkozni, akkor Linkként adjuk meg a horgony nevét elõtte egy kettõskereszt (#) karakterrel (pl.: #teteje).<br> Lehetõség van más oldalon lévõ horgonyra is hivatkozni, ilyenkor megadjuk a dokumentum Internet címét, majd #horgonynév (pl.: www.avix.hu/ie/hardware.htm#VGA, vagy relatív hardware.htm#VGA).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Bizonyos esetekben (pl.: eseménykezelés) hasznos, ha valamit hivatkozássá tudunk alakítani úgy, hogy az nem mutat semmire. Ilyen esetekben egy "névtelen" elnevezett horgonyt adunk meg a Link célpontjaként (simán #).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Levélküldés (mailto: linkek)</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha Link-ként a mailto:email-cím "helyet" adjuk meg, az ugrópontra klikkeléskor a böngészõ elindítja a felhasználó Internetes levelezõ-programját, és beírja a címzett mezõbe az email-cím-nél megadott értéket. Ha meg akarjuk adni a levél tárgyát (subject) is, akkor az email-cím után egy kérdõjelet írunk, majd a subject=tárgyszöveget.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Pl.: mailto:szego@interware.hu?subject=tanfolyam</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>DreamWeaver 3 -ban lehetõségünk van az E-Mail Link objektum használatára, ilyenkor egy felbukkanó dialógusablakban kell megadnunk a link szövegét és a hozzá tartozó e-mail címet (és esetlegesen a tárgyat).</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Egyéb "link" típusok</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>javascript: utasítás<br> Egy JavaScript nyelvû parancsot, illetve egy ilyen nyelven megírt funkciót tudunk vele végrehajtani. Természetesen csak a JavaScriptet ismerõ böngészõk tudnak mit kezdeni vele. Pl.: javascript: alert('Klikk.')</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>about: valami<br> Létezik ilyen. CSAK az Internet Explorer használja. Pl.: about:blank.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p style='margin-bottom:12.0pt'><span style='font-size:9.0pt;font-family:Arial; color:black'>Vissza a tartalomhoz</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><a name=táblázatok><span style='font-size:24.0pt;font-family:Arial;color:black'>Táblázatok</span></a><span style='mso-bookmark:táblázatok'></span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatokat adatok rendezett megjelenítésére, illetve az adott oldalon lévõ kölönbözõ objektumok pozícionálására használjuk. Természetesen lehetõség van a táblázat egy cellájába egy másik táblázatot is beilleszteni.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatok létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatot az Insert menü Table pontja használatával, vagy az object palettán lévõ Táblázat ikonra klikkelve, ill. a megfelelõ helyre húzva illeszthetünk be. A megjelenõ dialógusablakban rögtön megadhatjuk táblázatunk alapvetõ jellemzõit.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Rows: A táblázat sorainak száma<br> - Columns: Oszlopok száma.<br> - CellPadding: Megadhatjuk a cellák "kibélelésének" mértékét. Ez tulajdonképpen a cella tartalma és a cella széle között távolság pixelben meghatározva. Ha nem adunk meg értéket, a program az alapértelmezett 1px-es beállítást alkalmazza.<br> - CellSpacing: A cellák egymástól mért távolságát (pixelben) állíthatjuk be ennél a pontnál.<br> - Width: Táblázatunk szélessége. Megadható szélességként fix méret pixelben, de lehetõségünk van a befoglaló rész bizonyos százalékaként is meghatározni a szélességet. Ez utóbbi esetben ha a böngészõ ablakát atméretezzük, a táblázat mérete is megváltozik. Fontos, hogy ebben a pontban a táblázat minimális szélességét tudjuk meghatározni.<br> - Border: A keret vastagsága pixelben. Ha nem akarunk keretet, akkor állítsuk ezt az értéket nullára. Alapértelmezett állapotban 1. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Természetesen az itt megadott beállításokat a késõbbiekben is tudjuk módosítani.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatok kijelölése</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A táblázatot kijelölhetjük a táblázat bal felsõ sarkára kattintva (ilyenkor az egérmutató négy irányba mutató nyíl alakú). Bizonyos esetekben ez a módszer nagyon körülményes, ilyenkor a jobb egérgombbal klikkeljünk (Mac: CTRL+KLIKK) a táblázat területén belül bárhová, majd a megjelenõ menübõl válasszuk a Table / Select Table pontot.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatok tulajdonságai</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Név: Táblázatunk neve. Késõbb, az eseménykezeléssel kapcsolatos beállításoknál lehet szerepe.<br> - H: Minimális magasság beállítása %-ban, vagy pixelben.<br> - Align: Beállíthatjuk a táblázat igazítását a táblázatot tartalmazó részen belül. Ezt a beállítást csak a 4.0-nál nagyobb verziószámú böngészõk képesek értelmezni. Ha azt akarjuk, hogy a régebbiekben is a megfelelõképpen jelenjen meg, akkor lehetõségünk van úgy beigazítani, mint ahogy azt sima szöveggel tettük.<br> - Ikonok(bal): A táblázat sorainak magasságát, ill. oszlopainak szélességét csökkenthetjük a tartalomtól függõen a minimális méretre.<br> - Brdr: Itt tudjuk beállítani a táblázat keretének színét.<br> - V,H_Space: A táblázat széleitõl számított üresen hagyott területeket állíthatjuk be itt, mint a képek hasonló beállításánál.<br> - Px: A táblázat %-os szélességét pixelesre konvertálja az adott képernyõméret alapján.<br> - %: Pixeles szélességet alakít %-ossá.<br> - LightBrdr: A táblázat bal oldali szélén, ill. a tetején a keret színe.<br> - DarkBrdr: A jobb oldali, ill. alsó keret színe. Ez a két beállítás a táblázat celláinál pontosan fordítva érvényesül. Ügyes használatukkal 3D-szerû hatásokat érhetünk el. Fontos: Ez a két beállítás felülírja a Brdr-nél megadottat.<br> - Bg: Beállíthatjuk a táblázat háttérszínét (a másik pontban a háttérképet). </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Egyéb kijelölések táblázatokban</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Sor kijelölése: Vigyük az egérmutatót az adott sor bal oldalára, és amikor megjelenik a mutató vízszintes irányú nyíllá változik, kattintsunk rá.<br> - Oszlop kijelölése: Az adott oszlop fölé állva, amikor a lefelé mutató nyíl megjelenik, kattintsunk rá.<br> - Szomszédos cellák<br> kijelölése: A kijelölni kívánt cellák befoglalhatók egy képzeletbeli téglalapba. Kattintsunk a téglalap egyik sarkára, majd a Shift billentyû lenyomva tartása mellett a szemközti sarokra.<br> - Egymással nem szomszédos<br> cellák kijelölése: A CTRL billentyû lenyomva tartása mellett klikkeljünk a kijelölni kívánt cellákra egymás után. </span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Cellák tulajdonságai, kapcsolódó mûveletek</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Properties paletta felsõ sorában a cellákban lévõ szöveges részek formázását végezhetjük el.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Két négyzet: Kijelölt cellák egyesítése<br> - Horz: A cellák tartalmának vízszintes igazítása<br> - Vert: Cellatartalom függõleges igazítása<br> - W: Kijelölt cellák minimális szélessége a táblázaton belül (% vagy px).<br> - H: Minimális magasság<br> - NoWrap: Bekapcsolva a cella ill. táblázat mérete a cella tartalmával együtt változik, a szöveges tartalom csak akkor kerül új sorba, ha azt direkt megadjuk egy újsor karakterrel. Ha nincsen bekapcsolva, a cella elõször vízszintes irányban növekszik addig, hogy a leghosszabb szó elférjen benne, majd függõleges irányban változtatja méretét.<br> - Header: A kijelölt cellákban található szöveget alakítja táblázat-fejléc formátumúra (Félkövér stílus, középre igazítás). </span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> A Bg, Brdr beállítások használata megegyezik a táblázatoknál leírtakkal. Fontos, hogy a cellák formázása mindig prioritást élvez az egész táblázat formázásával kapcsolatban (Pontosabban a sorrend: Cellák - Sorok - Táblázat).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatok módosítása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A táblázatok tulajdonságai módosíthatók a megfelelõ tulajdonságoknak a Properties palettán történõ átállításával, ill a Modify menü Table pontjának különbözõ alpontjai segítségével.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Select Table: Táblázat kiválasztása<br> - Merge Vells: A kijelölt cellák összevonása egy cellává<br> - Insert Row: Üres sor beszúrása az éppen aktuális fölé<br> - Insert Column: Egy új oszlop beszúrása az aktuális elé<br> - Insert Rows or Columns: Insert: Beállíthatjuk, hogy sorokat (Rows) vagy oszlopokat (Columns) akarunk beszúrni<br> Number of: Itt adhatjuk meg a beszúrni kívánt sorok ill. oszlopok számát<br> Where: Beállíthatjuk, hogy az új elemek az aktuális kiválasztás fölé (Above Selection) vagy alá (Below Selection) kerüljenek majd<br> <br> - Delete Row: Használatával töröljük az aktuális sort.<br> - Delete Column: Az aktuális oszlop törlése<br> - Incrase Row Span: A kijelölt cellát összeolvaszthatjuk az alatta lévõvel (vagy lévõkkel).<br> - Incrase Column Span: A kijelölt cállát összevonja a tõle balra esõvel (ill. esõkkel).<br> - Decrase Row,<br> Column Span: Az elõzõ pontokkal átalakított cellákat állíthatjuk vissza eredeti formájukra.<br> - Clear Cell Heights: A táblázat sorainak magasságát csökkenthetjük a tartalomtól függõen a minimális méretre.<br> - Clear Cell Widths: A táblázat oszlopainak szélességét csökkenti a tartalomtól függõen a minimális méretre.<br> - Convert Width<br> to Pixels: A cella ill. oszlop szélességét fix, pixeles szélességgé alakítja<br> - Convert Width<br> to Percents: Pixeles adatot konvertál %-ra </span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatok formázása elõredefiniált sablonok alapján</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A táblázat kiválasztása után válasszuk a Commands menü Format Table pontját. A megjelenõ dialógusablakban válogathatunk a bal felsõ részen látható sablonok között. Lehetõségünk van a formázással kapcsolatos utasítások manuális megadására is:</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Row Colors: Kétféle színt definiálhatunk, amelyek majd 1-, 2-, 3- ill. 4 soronként váltogatják egymást.<br> - Top Row: Align: Tartalom igazítása<br> Text Style: Félkövér / Dõlt / Félkövér és dõlt / Normál betûtípus<br> Text Color: A szöveg színe<br> Bg Color: A sor háttérszíne<br> <br> - Left Col: A bal oldali oszloppal kapcsolatos beállítások<br> - Border: A táblázat keretének vastagsága. A program a felsõ két színbeállítást alkalmazza Light ill. Dark Borderként.<br> - Apply all Attribs<br> to TD tags<br> instead of TR tags: A formázási parancsok nem a táblázat sorára (<TR>), hanem a cellákra lesznek kiadva (<TD>). (ld.: formázások prioritása egy táblázatban). </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Táblázatok rendezése</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Lehetõségünk van egy adatokat tartalmazó táblázat rendezésére annak egy vagy két oszlopa alapján. Fontos, hogy ezt a parancsot csak olyan táblázatokra alkalmazhatjuk, melyek nem tartalmaznak összevont cellákat.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A rendezést a Commands menü Sort Table pontjának segítségével végezhetjük el<br> - Sort By: Elõször melyik oszlop szerint történjen a rendezés Order: Beállíthatjuk, hogy a rendezés ABC- vagy számsorrendben történjék, illetve, hogy növekvõ vagy csökkenõ sorrendbe legyenek rendezve az adatok.<br> <br> - Then By: Megadhatjuk a másodlagos rendezési szempontot. Itt is beállítható külön a sorrend.<br> - Sort Includes<br> Firs Row: Ha bekapcsoljuk, a táblázat elsõ sora is rendezésre kerül, egyébként nem.<br> - Keep TR Attributes<br> with Sorted Row: Bekapcsolva a sor rendezés után is megtartja a rá vonatkozó formázási beállításokat. </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Tabular Data objektum</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Egyes táblazatkezelõ programoknál lehetõségünk nyílik arra, hogy táblázatainkat szóköz - vagy tabulátor karakterekkel tagolt szövegfile-ként mentsük el. DreamWeaver 3-at használva lehetõségünk nyílik az ilyen formában elmentett file-ok táblázatként való beillesztésére.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Beillesztés: Insert menü Tabular Data pontjával, vagy az object paletta Tabular Data elemével.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Data File: Itt adjuk meg a táblazat adatait tartalmazó szövegfile-t.<br> - Delimeter: Meghatározzuk az adatok tagolására használt karaktert (TAB, vesszõ, pontosvesszõ, kettõspont, egyéb).<br> - Table Width: A létrejövõ táblázat szélességére vonatkozó beállítás. - Fit to Data: A táblázatban az egyes cellákban lévõ adatok mindig egy sorba kerülnek, a táblázat szélessége ehhez fog igazodni.<br> - Set: Mi állítunk be egy fix (pixel), vagy %-os értéket a táblázat szélességének.<br> <br> - Cell Padding,<br> Cell Spacing: Cellabélelés, és a cellák közötti távolság pixelben.<br> - Border: A táblázat keretének vastagsága (px).<br> - Format Top<br> Row: A táblázat legfelsõ sorának ("fejlécének") formázása - Normal: Sima<br> - Bold: Félkövér szöveg<br> - Italic: Dõlt karakterek<br> - Bold Italic: Félkövér, dõlt karakterek</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>(A format Top Row pontot nem érdemes használni, a Format Table paranccsal sokkal több lehetõségünk nyílik a létrejött táblázat megformázására. Ld.: Táblázatok formázása elõredefiniált sablonok alapján)</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p style='margin-bottom:12.0pt'><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p> </o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=Formanyomtatványok><span style='font-size:18.0pt;font-family:Arial;color:black'>Formanyomtatványok</span></a><span style='mso-bookmark:Formanyomtatványok'></span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A formanyomtatványoknak a felhasználóktól való információ gyûjtésében van szerepük.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatok létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Táblázatot az Insert menü Table pontja használatával, vagy az object palettán lévõ Táblázat ikonra klikkelve, ill. a megfelelõ helyre húzva illeszthetünk be. A megjelenõ dialógusablakban rögtön megadhatjuk táblázatunk alapvetõ jellemzõit.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Felhasználásuk: - Véleménykutatás<br> - On-Line vásárlások<br> - Keresõk </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> A formok mûködéséhez két dolog szükséges - A HTML-kód, ami a Form megjelenítésérõl gondoskodik; és egy szerver oldali alkalmazás, v. script ill. kliens oldali script (CGI), ami az adatok feldolgozásáról gondoskodik. DreamWeaverrel lehetõségünk van Formok létrehozására, kliens oldali ellenõrzésükre, vagy más típusú kliens oldali feldolgozásra scriptek segítségével (ehhez már legalább JavaScript tûrhetõ ismerete szükséges).</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Formok létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Használhatjuk az Insert menü Form pontját, vagy az Objects paletta Forms részérõl a Form ikonra kattintva, ill. azt a dokumentum megfelelõ helyére húzva is létrehozhatunk formanyomtatványokat.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Formanyomtatványok tulajdonságai</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Név: A formanyomtatvány nevének a kliens oldali kezelésnél van értelme. Ez az adat nem kerül majd a szerver felé elküldésre.<br> - Action: Itt kell megadnunk azt az Internet címet (linket), ahhol az a szerver oldali script vagy alkalmazás található, amely majd a Form feldolgozását fogja végezni. Ha a feldolgozást kliens oldalon végezzük, nem kell megadni, mert ilyenkor más módszereket használunk.<br> - Method: Az adatátadási módszert állíthatjuk be. - Get: Az adatok az Action-nél megadott URL-hez hozzáfûzve kerülnek elküldésre. Ez a módszer több szempontból hátrányos. Egyrészt az URL látható, tehát lehetõleg ha jelszavakat is küldünk ne alkalmazzuk ezt a módszert. Másrészt mivel egy URL maximum 8192 karakter hosszúságú lehet, ezért így csak korlátozott mennyiségû információ átadására van lehetõség. Vannak esetek, amikor mégis ezt érdemes használni.<br> - Post: Az adatok a Standard Bemeneten (<STDIN>) kerülnek átadásra.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Formok elemei, és tulajdonságaik</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Elemek beillesztése: Insert / Form Object / Elem, vagy az Objects paletta megfelelõ elemére kattintva, illetve azt a dokumentumba húzva.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Szövegmezõ (Textfield)<br> A különbözõ szövegmezõk szöveges adatok bevitelére szolgálnak.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Tulajdonságaik:<br> - Név: a mezõ tartalmához kötött név, ami majd paraméterként átadásra kerül. Itt említjük meg, hogy egy formanyomtatvány minden egyes elemének más névvel kell rendelkeznie.<br> - Char Width: Megadja, hogy a mezõben maximum hány karakter jeleníthetõ meg; azaz hány karakter szélességû az adott mezõ.<br> - Max Chars: Itt adjuk meg, hogy az adott szövegmezõbe maximálisan hány karakter gépelhetõ be. Ha a mezõ Multi Line típusú, ez az opció nem jelenik meg.<br> - Num Lines: Beállíthatjuk, hogy a szöveges területünk hány sor magasságú legyen. Ez az opció nem jelenik meg Egysoros- ill. Jelszó típusú szövegmezõknél.<br> - Type: A szövegmezõ típusa: - Single Line: Egy soros beviteli mezõ.<br> - Multi Line: Több soros beviteli mezõ.<br> - Password: Jelszó mezõ. Lényegében teljesen úgy mûködik, mint a Single Line típusú beviteli mezõ, de a begépelt karakterek helyett majd csak valamilyen maszk-karakterek fognak megjelenni a weboldalon.<br> <br> - Init Value: Az adott mezõ alapértéke. Kiindulási állapotban a mezõben az itt megadott szöveg lesz, valamint ha a felhasználó egy Reset típusú nyomógombra kattint, az itt megadott érték fog ismételten beíródni.<br> - Wrap: (Csak Multi Line típusnál.) Itt kikapcsolhatjuk (Off) a szöveg automatikus tördelését, ill. különbözõ módszereket adhatunk meg hozzá (Virtual, Physical). </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Jelölõnégyzet (CheckBox):</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Választási lehetõségeket tartalmazó opció-sorozatoknál használjuk, azokban az esetekben, amikor azt akarjuk, hogy az adott csoport több eleme is választható legyen.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Tulajdonságai:<br> - Név:<br> - Checked Value: Azt az értéket adjuk meg, ami majd a formanyomtatvány elküldésekor az azt feldolgozó alkalmazásnak átadódik, abban az esetben, ha a felhasználó az adott jelölõnégyzetet kipipálta.<br> - Initial State: Beállíthatjuk, hogy alaphelyzetben ki legyen-e pipálva (Checked), vagy ne (Unchecked) az adott CheckBox. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Opcióválasztó mezõ (Radio-Button):</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Akkor használjuk, ha azt akarjuk, hogy egy opció-csoportból egyszerre csak egy elem legyen kiválasztható. Az ilyen opciócsoport egyik elemét kiválasztva az összes ugyanazon csoportba tartozó lehetõség kiválasztása törlõdik.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Tulajdonságai:<br> - Név: Az ópciócsoport neve, amelybe majd az adott mezõ tartozni fog. MINDEN AZONOS csoportban lévõ Radio-Buttonnak ugyanazzal a Névvel KELL rendelkeznie.<br> - Checked Value: Azt az értéket adjuk meg itt, ami elküldésre kerül, ha az adott opció van kiválasztva.<br> - Initial State: Beállíthatjuk, hogy kezdetben az adott opció ki van-e választva. Elméletileg lehetõség van egy csoport több elemét is alapértelmezésként kiválasztani, de kerüljük az ilyen megoldást, hiszen azért alkalmazunk ilyen típusú formanyomtatvány elemet, hogy ezt majd elkerüljük. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Listák és Menük:</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Használatukkal értéksorozatokat kínálhatunk a felhasználónak, amelybõl majd szabadon választhat (egy vagy több lehetõséget).</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A listáknak három fajtájuk van: Legördülõ (Menu), sima lista (List), ill. lista több választási lehetõséggel (List).</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Tulajdonságai:<br> - Type: A lista típusát állíthatjuk be. (Menu v. List)<br> - Height: Megadhatjuk, hogy hány sor magas legyen a lista (Menu típusnál ez a pont nem jelenik meg).<br> - Allow Multiple: Ezt a pontot bejelölve megadhatjuk, hogy a listának egyszerre több eleme is kiválasztható legyen.<br> - List Values: Erre a nyomógombra kattintva a listát szöveggel, és a hozzá tartozó elküldendõ érkekkel tudjuk feltölteni, illetve a már megadott elemeit törölhetjük, módosíthatjuk, sorrendjüket változtathatjuk meg.<br> - Initially Selected: A lista alapértelmezettként kiválasztott pontját (ill. többszörös választás engedélyezése esetén pontjait) állíthatjuk be. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>File Feltöltés (File Upload):</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A File feltöltés mezõ tulajdonságai megegyeznek az Egysoros (Single Line) szöveges mezõ tulajdonságaival. Ilyen mezõ beillesztésekor a mezõ mellett meg fog jelenni egy nyomógomb is, aminek segítségével a felhasználó majd megkeresheti a feltölteni kívánt file-t gépén.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Meg kell említeni, hogy ez a mezõ csak akkor fog mûködni, ha az adott szerveren engedélyezve van a névtelen (anonymous) feltöltés.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Abban az esetben, ha használjuk ezt a mezõt, manuálisan be kell írnunk a <FORM> tag-be az ENCTYPE="multipart/form-data" paramétert, hogy biztosítsuk a feltölteni kívánt file megfelelõ kódolását.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Kép-mezõ (Image-field):</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Segítségével egy képet illeszthetünk a formanyomtatványba (ezt egyébként egy sima képpel is megtehetjük).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Rejtett mezõ (Hidden field):</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Az ilyen típusú mezõket a böngészõ nem fogja megjeleníteni. Szerepe: A formmal együtt még egy név-érték párost tudunk küldeni a feldolgozó alkalmazásnak. Ennek például akkor lehet szerepe, ha egy alkalmazás több formanyomtatvány feldolgozását is elvégzi. Ilyenkor ezzel tudjuk azonosítani az adott formanyomtatványt (ugyanis formanyomtatvány neve NEM kerül elküldésre).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Nyomógombok (Button):</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Funkció szerint háromféle nyomógombot különböztetünk meg:</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Elküldõ - gomb (Submit)<br> - Alaphelyzetbe állító gomb (Reset)<br> - Sima gomb (None)<br> Tulajdonságai:<br> - Név:<br> - Label: A gombon található felirat<br> - Action: A gomb mûködése<br> - Submit form: A gomb a form -ot fogja elküldeni feldolgozásra<br> - Reset form: A gomb alaphelyzetbe állítja a formanyomtatványt<br> - None: Alaphelyzetben semmit sem csinál, nekünk kell majd valamilyen kliens-oldali scripttel leírni a mûködését. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Jump Menu:</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Segítségével létrehozhatunk egy legördülõ menüt, amelynek valmelyik elemét választva egy beállított oldalt tudunk megjeleníteni.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Tulajdonságai:<br> - Menu Items: Ebben a mezõben válogathatunk a legördülõ menü tartalma között, a +, - gombokkal új elemeket hozhatunk létre, ill. törölhetjük a meglévõket. A le - fel nyilak segítségével a menü elemeinek sorrendjén változtathatunk.<br> - Text: A kiválasztott ponthoz tartozó szöveges részt adhatjuk meg, ez a szöveg fog megjelenni a menüben.<br> - When Selected<br> Go to URL: Az adott ponthoz tartozó hivatkozást adhatjuk meg.<br> - Open URLs in: Kiválaszthatjuk, hogy a megadott hivatkozást melyik ablakban ill. frame-ben akarjuk majd megjeleníteni (ld.: Frame-ek).<br> - Menu Name: Nevet rendelünk a menünkhöz. Ez a JavaScript alkalmazása miatt fontos.<br> - Options: Egyéb lehetõségek<br> - Insert Go Button<br> After Menu: Beszúr egy Go feliratú nyomógombot (Button - none + Javascript), amellyel szintén a kiválasztott hivatkozást tudjuk majd megejeleníteni.<br> - Select First Item<br> After URL Change: Az "ugrás" után a menünek mindig az elsõ eleme lesz kiválasztva. </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Maga a Jump Menu mûködése szerint nem tartozik egy form elemei közé.<br> Tudni kell, hogyha a menü egy elemét kiválasztjuk, az ugrás azonnal megtörténik, ezért alaphelyzetben a Go nyomógomb alkalmazásának semmi értelme sincs. (Az automatikus ugrás elkerülhetõ, ha a menüt tartalmazó SELECT mezõrõl eltávolítjuk az onChange eseménykezelést. Ezután az objektum azonban nem lesz Jump Menu-ként szerkeszthetõ.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Formanyomtatványok alkalmazásával kapcsolatos megjegyzések</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p style='margin-bottom:12.0pt'><span style='font-size:9.0pt;font-family:Arial; color:black'>A formokat elküldés elõtt érdemes valamilyen kliens oldali scripttel ellenõrizni, hogy helyesen lettek-e kitöltve.<br> Formanyomtatvány elemeket nem csak formanyomtatványokon belül használhatjuk. Ennek különbözõ kliens-oldali scriptek alkalmazásakor van jelentõsége (pl.: Jump Menu).<br> A Jump Menu-t NE alkalmazzuk egy FORM-ban!<br> Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=Sitemanagement><span style='font-size:18.0pt;font-family:Arial;color:black'>Site Management</span></a><span style='mso-bookmark:Sitemanagement'></span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Site meghatározása:<br> Egy tárolóhely azoknak a dokumentumoknak (html file-ok, képek, …), amelyek egy webhelyhez tartoznak. Egy Site egy vagy két részbõl áll - egy lokális részbõl, és esetlegesen egy távoli (remote) részbõl.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Site-ok alkalmazásának szerepe</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Site-ok alkalmazásával lehetõségünk nyílik a dokumentumaink közötti linkek ellenõrzésére, a webhely könyvtárstruktúrájának megváltoztatására anélkül, hogy manuálisan esetlegesen több száz hivatkozást kelljen kijavítanunk. Egy klikk segítségével fel-, letölthetjuk dokumentumainkat.<br> A Check In / Out rendszer használatával a csapatmunkát tudjuk lényegesen megkönnyíteni, az ilyen munkából adódó hibalehetõségek nagy részét kiszûrni.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Site-ok létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Site-ot a Site / New Site pont segítségével hozhatunk létre.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Local Info:<br> - Site Name: A tárhelyünkhöz rendelt név. A késõbbiekben ez alapján fogjuk tudni azonosítani Site-jainkat.<br> - Local Root<br> Folder: Itt adjuk meg azt a helyet a merevlemezen, ahhol a Site-hoz tartozó file-ok tárolásra kerülnek. Az itt definiált könyvtár lesz a Site gyökér (\) könyvtára. (Relatív hivatkozások alkalmazásánál erre is lehet relatívan hivatkozni - pl.: /ajanlt/akciok.html)<br> - HTTP adress: Megadhatjuk Site-unk majdani Internetes helyét, így a dokumentumban lévõ, erre a helyre történõ abszolút hivatkozások Offline módban is ellenõrizhetõvé vállnak.<br> - Cache: Létrehozhatunk egy kiegészítõ tárat, ez meggyorsítja a linkek ellenõrzését, az oldalak frissítését. Érdemes használni (Ha nem kapcsoljuk be, a program a Site létrehozása elõtt még egyszer rá fog kérdezni, hogy létrehozzon-e cache-t). </span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p style='margin-bottom:12.0pt'><span style='font-size:9.0pt;font-family:Arial; color:black'>- Web Server Info:<br> - Server Access: a Site "távoli" megfelelõjéhez való hozzáférés módját állíthatjuk be. - None: Nincs távoli hely, csak lokálisan dolgozunk.<br> - Local/Network: A "távoli" hely a saját gépünkön egy másik könyvtárban található (Local), vagy a helyi hálózaton keresztül kapcsolódunk hozzá (Network). A megjelnõ Remote Folder mezõben adjuk meg a Site gyökérkönyvtáraként kezelt könyvtárat.<br> - FTP: A távoli helyhez egy FTP kiszolgálón keresztül kapcsolódunk.<br> - FTP Host: Az FTP kiszolgáló címe (pl.: ftp.ora.com).<br> - Host Directory: Az adott kiszolgálón lévõ könyvtárunk, ami a gyökérkönyvtár megfelelõje<br> - Login: A kiszolgálóra történõ bejelentkezéshez használt felhasználói név.<br> - Password: Jelszavunk. (a Save pont bekapcsolásával mentõdik, nem kell mindig megadnunk.)<br> - Use Firewall: Ha az FTP kiszolgálóhoz egy tûzfalon keresztül kapcsolódunk, akkor ezt a pontot jelöljük be.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Check In / Check Out:</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Check In / Check Out rendszert akkor használjuk, ha többen dolgozunk egy weblap elkészítésén, vagy egyedül, de több helyrõl. A rendszer lehetõvé teszi, hogy ha valaki dolgozik egy file-lal, és azt kijelölte magának, akkor a többiek ne tudják azt megváltoztatni, amíg ez a helyzet áll fent. Ezzel kizárhatjuk az olyan hibákat, mint például amikor két ember egyszerre próbál elmenteni egy bizonyos file-t ugyanarra a névre.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>CSAK akkor használhatjuk a rendszert, ha van távoli hely is definiálva.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Check Out:<br> Kijelöljük a file-t, hogy mi dolgozunk vele. Egy pipa ikon jelenik meg mellette annak a felhasználónak a nevével, aki kijelölte magának a file-t (a pipa zöld, ha mi jelöltük ki; piros, ha valaki más). Kijelöléskor az adott file letöltõdik a távoli helyrõl, majd a távoli helyen csak olvashatóvá (read-only; locked) válik.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Check In:<br> Miután befejeztük a munkát az adott file-lal, ezzel a paranccsal tudjuk a rá vonatkozó kijelölésünket megszûntetni. Ilyenkor az adott file feltöltõdik a távoli helyre, ott írhatóvá válik, nálunk pedig csak olvasható lesz (read-only; locked).</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Beállítások:</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Enable Check In / Check Out: A rendszer alkalmazásának ki-, bekapcsolása.<br> Check Out Files When Opening: Egy file megnyitásakor automatikusan jelölõdjön ki, hogy dolgozunk vele.<br> Check Out Name: Kijelöléskor ez a felirat jelenjen majd meg a pipa ikon mellett, mint név. </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Site Map Layout:</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A hivatkozástérkép-módban történõ megjelenítésre vonatkozó beállítások.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Home Page: Webhelyünkhöz tartozó alapértelmezett nyitóoldal. Ha nem adunk meg semmit, a DreamWeaver megpróbálja az index.html, majd az index.htm file-t beállítani nyitóoldalként. Ha egyik sem sikerül, és Térkép módba akarunk kapcsolni, felszólít, hogy adjunk meg egy nyitóoldalt.<br> - Number of Columns: Itt adjuk meg, hogy egy sorban hány dokumentumot jelképezõ ikont akarunk maximum megjeleníteni egymás mellett.<br> -Column Width: Az ikonok, és a hozzájuk tartozó feliratok számára a rendelkezésre álló terület szélességet határozzuk meg ebben a pontban (pixel).<br> - Icon Labels: Beállíthatjuk, hogy az ikonok mellett a hozzátartozó file-név vagy oldalcím (<TITLE>) jelenjen meg.<br> - Display Files<br> Marked as Hidden: Rejtett file-ok megjelenítése.<br> - Display Dependent<br> Files: Bekapcsolva a dokumentumokhoz kapcsolódó, nem HTML file-ok is láthatóvá válnak (pl.: képek, appletek, flash mozik…). </span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Design Notes:</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Fejlesztés közben minden file-hoz megjegyzéseket fûzhetünk, amik munkatársaink számára is láthatóak lesznek. Segítségükkel tájékoztathatjuk õket elvárásainkról, észrevételeinkrõl, az adott file állapotáról, stb.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Maintain Design Notes:: Design Note-ok alkalmazásának be-, ill. kikapcsolása.<br> - Upload Design Notes for Sharing: Bekapcsolva megjegyzéseink fel fognak töltõdni a távoli helyre is, így a lapokon dolgozó többi ember számára is hozzáférhetõvé válnak.<br> - Clean Up: A gomb lenyomásával törölhetjük az olyan megjegyzéseket, amelyek nem tartoznak semelyik file-hoz sem. (pl.: A file-t már töröltük, de a megjegyzés megmaradt). </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Site-ablak</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Site Files: A távoli helyen lévõ file-ok megjelenítése. (Ha nem adtunk távoli helyet, akkor üres ablak jelenik meg.<br> Site Map: Egy hivatkozás-térképet jeleníthetünk meg segítségével, amely dokumentumaink egymáshoz kapcsolódását mutatja be.<br> Connect: A nyomógomb segítségével kapcsolódhatunk a megadott FTP kiszolgálóhoz.<br> Refresh: Használatával újra lekérhetjük a távoli helyen található adatok listáját (Frissítés).<br> Get: A kijelölt file-okat, könyvtárakat letölti a távoli helyrõl.<br> Put: A kijelölt file-okat a távoli helyre másolja. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Nyitóoldal definiálása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Egy file-t nyitóoldalnak (Home Page) állíthatunk be, ha ráklikkelünk az egér jobb gombjával (Mac: CTRL+Klikk), majd a menübõl a Set As Home Page pontot választjuk.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Linkek ellenõrzése</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Lehetõségünk van ellenõrizni, hogy a webhelyünkön (Site-unkon) belüli oldalakon található hivatkozások helyesek-e. Ezt a File menü Check Links / Entire Site pontjának segítségével tehetjük meg.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A dialógusablakban láthatjuk az ellenõrzés eredményét.<br> - Broken Links: Olyan hivatkozások, amelyek nem létezõ dokumentumokra mutatnak. Az ilyen hivatkozásokat ki kell javítanunk.<br> - External Links: Azok a hivatkozások, amelyek a Site-on kívüli helyekre mutatnak (pl.:maito: linkek). Ezeknek az ellenõrzése nem lehetséges DreamWeaver használatával.<br> - Orphaned Files: Olyan file-ok, amelyek a Site valamelyik könyvtárában helyezkednek el, de semmilyen hivatkozás nem mutat rájuk, tehát csak ott vannak, de nem elérhetõek, ezért feleslegesen foglalják a helyet. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p style='margin-bottom:12.0pt'><span style='font-size:9.0pt;font-family:Arial; color:black'>Vissza a tartalomhoz</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=Afejlécelemei><span style='font-size:18.0pt;font-family:Arial;color:black'>A Fejléc elemei</span></a><span style='mso-bookmark:Afejlécelemei'></span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A dokumentumok fejléc mezõjében a dokumentumra vonatkozó információkat (pl.: oldal címe) és a böngészõknek adott ún. fejlécparancsokat találjuk.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Head mezõ tartalma megtekinthetõ a HTML-ablakban (a <HEAD> és </HEAD> tag-ek között), vagy a szerkesztõablak felett, ha bekapcsoljuk a View menü Head Contents pontját.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Fejléc elemeket az Objects paletta fejléc (Head) részérõl szúrhatunk be az oldalba.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Az egyes elemek</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Title: Az oldal neve.<br> Meta: Oldallal kapcsolatos információk, fejlécparancsok.<br> Base: Hivatkozás alapok.<br> Link: Csatolások, csatolási viszonyok.<br> Script: A fejléc tartalmazhat még klien-oldali scripteket is. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><BASE> tag</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Href: Megadhatjuk, hogy az általunk használt relatív hivatkozások milyen címhez képest legyenek viszonyítva.<br> Target: Az alapértelmezett megjelenítési célpontot (ablak vagy frame) adjuk meg segítségével. Ha link létrehozásánál semmit nem adunk meg Target-ként, akkor ezt a beállítást fogja használni (egyébként alapértelmezett a _self). Abban az esetben, ha a linknél megadunk célpontot, természetesen az ott megadott célpont fog érvényesülni. </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><LINK> tag</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Href: A file URL-je (Internetes címe), amivel viszonyt akarunk meghatározni.<br> ID: Egy azonosítót rendelhetünk a <LINK>-hez.<br> Title: Egy név hozzáadás a viszonyhoz. Ennek stíluslapoknál lehet szerepe.<br> Rel: A href-ben megadott file-lal való viszony fajtája állítható be (a dokumentum – file viszony).<br> Rev: Fordított viszony definiálása (file – dokumentum viszony). </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Egy dologhoz vagy Rel-t, vagy Rev-et használjunk, mindkettõt ne!<br> A megadható viszonyok Rel és Rev esetén is ugyanazok.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A lehetséges viszonyok:</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Alternate: Másik verzió (HREFLANG-gal együtt használva másik nyelvû verzió, MEDIA-val más megjelenítésre [nyomtató, projector, stb.] szánt).<br> Stylesheet: Külsõ stíluslap (Stíluslap csatolás pl.: <LINK Rel=”Stylesheet” href="/stilus.css">).<br> Start: Kiinduló dokumentum egy dokumentum gyûjteménybõl.<br> Next: A dokumentum után következõ dokumentum, az ajánlott olvasási sorrend szerint. Egyes böngészõk (pl.:WebTV) az ilyen dokumentumokat elkezdik a háttérben letölteni, hogy a felhasználónak minnél kevesebbet kelljen rá várnia.<br> Prev: Elõzõ dokumentum.<br> Contents: A dokumentumhoz tartozó tartalomjegyzék.<br> Index: A dokumentum szószedete.<br> Glossary: A dokumentumhoz tartozó kifejezés gyûjtemény.<br> Copyright: A dokumentumhoz tartozó, szerzõi Copyright információkat tartalmazó dokumentum.<br> Chapter: Dokumentumgyûjtemény fejezete.<br> Section: Dokumentum egy szakasza.<br> Subsection: dokumentum egy alszakasza.<br> Appendix: Függelék a dokumentumhoz.<br> Help: Súgó a dokumentumhoz.<br> Bookmark: Könyvjelzõk egy dokumentumhoz. </span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>META tag-ek</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Meta tag-ek a dokumentumra vonatkozó metainformációkat, fejlécparancsokat tartalmazzák. Ilyenek pl. a Keywords, Description, Refresh. Bármennyi Meta tag szerepelhet egy oldal fejlécében.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Meatinformációk - <META NEME="Név" CONTENT="Érték"></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Segítségükkel név - érték párokat rendelhetünk a dokumentumunkhoz. Nincsen standard lista a megadható nevekrõl, ill. azok értékeirõl, bármit szabadon használhatunk. Létezik egy-két ilyen Metainformácios adat, amelyet speciális célokra alkalmazunk:</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Keywords:<br> Kulcsszavak. Egyes keresõk ennek a meta tagnek a segítségével határozzák meg, hogy bizonyos keresési kritériumoknak megfelel-e a dokumentum.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Pl.: <META NAME="Keywords" CONTENT="Suli, Iskola, Isi, suli, iskola, középiskola"></span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A keresõk általában csak az elsõ 100-150 adatot veszik figyelembe ebbõl a Meta tag-bõl.<br> Description:<br> Ha a dokumentum megfelel a keresési kritériumnak, akkor a keresõk egy része ezt a szöveget jeleníti meg, mint az adott dokumentum leírása.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Pl.: <META NAME="Description" CONTENT="A Kovács László Középiskola honlapja"></span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A keresõk általában csak az elsõ 100-120 karaktert jelenítik meg.<br> Fejlécparancsok - <META HTTP-EQUIV="Parancs" CONTENT="Paraméterek"></span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Refresh: A parancs egy megadott idõ elteltével betölt egy megadott URL-en található dokumentumot.<br> Pl.: <META HTTP-EQUIV=”Refresh” CONTENT=”10; www.extra.hu”> 10 másodperc elteltével az adott dokumentum helyett betölti a www.extra.hu címen található dokumentumot.<br> Expires: Dokumentum érvényességi idejét határozza meg. Megadja azt az idõpontot, amikor a dokumentum „lejár”.<br> Pl.: <META HTTP-EQUIV=”Expires” CONTEN=”Mon, 27 Aug 1998 12:00:00 GMT”><br> Content-Type: Adott dokumentum MIME-típusának, kódolásának leírása (Ld. Oldaltulajdonságok, karakter-kódolás).<br> Pl.: text/html; charset=Western.<br> Content-Script-Type: A beillesztett Scriptek alapértelmezett típusa. Pl.: text/javascript.<br> Content-Style-Type: A használt stílus alapértelmezett típusa. Pl.: text/css. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=Frame-ek><span style='font-size:18.0pt;font-family:Arial;color:black'>Frame-ek</span></a><span style='mso-bookmark:Frame-ek'></span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frame-ek segítségével részekre oszthatjuk a böngészõ ablakát, és ezen részekben más-más dokumentumokat jeleníthetünk meg.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Pl.: Két Frame-et alkalmazunk, az egyik a navigációs rész, ez fix, nem mozog, nem változik, a másik részben a navigációs részen választott témát jelenítjük meg.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frame-ekkel felosztott dokumentumok felépítése</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Az ilyen dokumentumok két részbõl állnak: egy, a Frame-ek elhelyezkedését, méreteit leíró oldalból (Frameset), és az adott Frame-ben megjelenített oldalból.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frame-ek létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Kapcsoljuk be a View menü Frame Borders pontját, majd az oldal valamelyik szélén kattintsunk a keretre, azután az ALT billentyût lenyomva tartva húzzuk azt a megfelelõ helyre.<br> Válasszuk a Modify menü Frameset pontját, majd a menübõl a megosztás irányát.<br> Válasszuk ki az objects paletta Frame részérõl az alkalmazni kívánt beosztást.<br> A régi böngészõk (3.0-nál kisebb verziószámúak) nem képesek a Fram-eket tartalmazó oldalak megjelenítésére.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ilyenkor ezek a Modify menü NoFrames Content pontja alatt megszerkesztett oldalt jelenítik meg.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Természetesen lehetõségünk van Frameset-ek egymásba ágyazására is.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frame-ek törlése</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Kapcsoljuk be a View menü Frame Borders pontját, majd a keretet ragadjuk meg az egérrel, és húzzuk ki a képernyõrõl.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Frames Paletta (Window / Frames)</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Frame-ekkel való munkában sok segítséget nyújt ez a paletta, leginkább az egyes Frame-ek, Frameset-ek kijelölését könnyíti meg.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Frame kijelölése: A palettán kattintsunk a kívánt Frame-be.<br> - Frameset kijelölése: A palettán kattintsunk a Frame-eket körülvevõ keretre.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frameset tulajdonságai</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Borders: A framesetben elhelyezkedõ frame-ek kereteinek alakja. Yes: 3D-s hatású keretek<br> No: Sima, egyszínû keretek<br> Default: Böngészõ beállítása szerint (általában Yes).<br> <br> Border Width: A keretek szélessége (px). Ha nem akarunk kereteket alkalmazni, akkor állítsunk be nullát szélességnek.<br> Border Color: A keretek színe.<br> Value: Az éppen kiválasztott frame méretét állíthatjuk be itt. A framek között a paletta jobb oldalán lévõ, a frameset beosztását jelképezõ ikon egyes részeire kattintva tudunk váltani. Az itt megadott beállítások akkor lesznek igazán fontosak, ha a felhasználó átméretezi a böngészõ ablakot. Az egyes Frame-ek méretének változása az itt és a Units pontnál megadott értékektõl fog függeni.<br> Units: A méretezéshez használt mértékegység. Pixel: Az adott frame fixen ennyi képpont szélességû, ez a méret akkor sem fog megváltozni, ha a felhasználó átméretezi a böngészõ ablakot.<br> Percent: A frame az ablak méretének a Value pontban megadott százalékát fogja kitölteni. Ez a szélesség az ablak átméretezésével megváltozik.<br> Relative: Csak egy Frame méretezéséhez használhatjuk. Az adott Frame ki fogja tölteni az összes helyet, amelyet a többi Frame szabadon hagy neki. Ilyen esetben a program a Value pontban megadott értéket nem veszi figyelembe.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frame-ek tulajdonságai</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frame Name: Az adott Frame neve. Fontos, hogy elnevezzük õket, mert késõbb ez alapján fogunk hivatkozni rájuk, ha valamit egy adott frame-ben akarunk megjeleníteni.<br> Src: Annak a dokumentumnak a helye, amit alaphelyzetben az adott Frame-ben akarunk megjeleníteni.<br> Borders: Beállíthatjuk az adott Frame keretének típusát. A beállítási lehetõségek megegyeznek a Frameset tulajdonságainál leírtakkal, de ezen beállítások értelem szerûen felülbírálják a Frameset beállításait.<br> Border Color: A keret színe. Ez is felülírja a Frameset-nél megadott értéket.<br> Scroll: Ebben a pontban beállíthatjuk a Frame viselkedését arra az esetre vonatkozóan, ha a tartalma nem férne el benne. Auto: Amennyiben a Frame tartalma nem fér el a Frame-ben, akkor görgetõsávok jelennek meg.<br> Default: Böngészõ beállítása szerinti viselkedés (általában Auto).<br> Yes: Mindenképp megjelennek a görgetõsávok, akkor is, ha a tartalom elfér a Frame-ben.<br> No: A görgetõsávok nem jelennek meg, abban az esetben sem, ha a tartalom nem férne el az adot területen.<br> <br> No Resize: Bekapcsolásával megakadályozhatjuk, hogy a felhasználó a böngészõablakban átméretezze a Frame-eket.<br> Margin width,<br> height: A Frame szélei- és tartalma között lévõ üresen hagyott terület mérete (margó). </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frameset mentése</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Magát a Frame-ek elhelyezését leíró dokumentumot a File menü Save Frameset pontjával tudjuk elmenteni.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Frame-ek mentése</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Klikkeljünk a szerkesztõablakban valahová az elmenteni kívánt Frame-en belül, majd válasszuk a File menü Save, vagy Save As pontját.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Hivatkozások célpontjának kiválasztása</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A dokumentumban elõforduló minden egyes hivatkozásnál lehetõségünk van megadni, hogy azt a hivatkozást hol (melyik ablakban v. frame-ben) akarjuk megjeleníteni. Ezt a hivatkozás tulajdonságainál (properties paletta) a Target nevû legördülõ menü megfelelõ pontját választva tehetjük meg. Ha egy általunk létrehozott frame-ben kívánjuk a megadott oldalt megjeleníteni, válasszuk a menübõl az adott Frame nevét.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Megjegyzések</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Mindig érdemes a frame tartalmát az adott frame-ben megszerkeszteni. Bizonyos esetekben egy frame-ben több oldalt is meg fogunk jeleníteni egymás után, ilyenkor szerkesztésnél mindig az adott Frame-ben nyissuk meg õket (File menü, Opne in Frame), majd a szerkesztés befejeztével mentsük el az oldalt, de a Frameset-et NE!</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Frame-ek háttérszínei: A Frame-ek nem rendelkeznek önálló háttérszínnel, ez mindig az éppen megjelenített dokumentumtól függ.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Alapesetben a Frame-eket tartalmazó oldal címe a FRAMESET oldalbeállításainál megadott címmel fog megegyezni!</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=Animációtimelineoksegítségével><span style='font-size:18.0pt;font-family: Arial;color:black'>Animáció Timeline-ok segítségével </span></a><span style='mso-bookmark:Animációtimelineoksegítségével'></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Timeline-okkal létrehozott animáción tulajdonképpen rétegek helyzetének, méretének, láthatóságának, Z-indexének adott idõközönkénti dinamikus megváltoztatását értjük. Ezt a DreamWeaver egy Javascript létrehozásával éri el.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Alkalmazásának elõnye: Semmiféle Plugint, Active-X vezérlõelemet nem igényelnek, hiszen csak rétegeket és JavaScriptet alkalmazunk.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>FONTOS:<br> A Timeline-ok rétegekkal kapcsolatos funkciói csak a 4.0+ böngészõkben mûködnek. Alkalmazásuk során vigyáznunk kell, hogy ne töröljünk az oldalról olyan elemeket, amelyekre a Timeline használata során hivatkozunk.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p><b><span style='font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php##">A Timeline paletta</a></span></b><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Az Autoplay bekapcsolásával az animáció automatikusan le fog játszódni, ha az oldal letöltõdött.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha Loop-ot bekapcsoljuk, végtelenített módban játszódik le az animáció.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Fps: Másodpercenként megjelenítendõ képkockák száma. Ne állítsuk 15 fölé, mert a legtöbb böngészõ ugysem tudja ennél gyorsabban lejátszani.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Animáció létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Mozgassuk az animálni kívánt rétegünket a kiindulási helyzetbe.<br> Válasszuk a Modify / Timeline / Add Object to Timeline pontot.<br> Klikkeljünk a Timeline palettán az utolsó képkockára (egy üres kör található itt, jelezve, hogy ez egy kulcskocka).<br> Mozgassuk a réteget a kívánt befejezõ helyzetbe.<br> Lehetõségünk nyílik további kulcskockák meghatározására is, ehhez a megfelelõ csatorna kívánt képkockájában klikkeljünk az egér jobb gombjával (Mac: CTRL+Klikk), majd válasszuk az Add KeyFrame pontot. (Ugyanezt a hatást érjük el, ha a CTRL (Mac: Command) gomb lenyomása mellett az adott képkockára kattintunk).</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Minden kulcskockában meghatározhatjuk az animációban résztvevõ réteg helyét, méretét (Netscape Navigator böngészõnél ez nem használható), Z-indexét, láthatóságát.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Természetesen az animáció minden egyes képkockáját kulcskockává alakíthatjuk.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Megjegyzés:<br> Timeline-ba kép is felvehetõ, de ennek csak az src (forrás) tulajdonságát tudjuk dinamikusan változtatni, és ennek a hátásnak az eléréséhez is sokkal jobb megoldás (ld. késõbb).</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Rétegek mozgatása meghatározott út alapján</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Válasszuk ki az animálni kívánt réteget.<br> Mozgassuk abba a pontba, ahol az animáció kezdetekor lesz.<br> Válasszuk a Modify / Timeline / Recorf Path of Layer pontot.<br> Ragadjuk meg a réteget, és húzzuk végig azon az úton, amit meg akarjuk, hogy tegyen az animáció során.<br> A végpont elérésekor engedjük el az egér gombját. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Timeline-ok módosítása</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Animáció idejének<br> növelése: Ragadjuk meg, és húzzuk el jobbra az utolsó képkockát. Ilyenkor a többi kulcskocka elosztása arányosan történik. Ha azt akarjuk, hogy csak az utolsó képkocka helyzete módosuljon, húzás közben tartsuk lenyomva a CTRL billentyût.<br> - Kulcskockák mozgatása: Egyszerûen húzzuk a kulcskockát a kívánt pozícióba.<br> - Egész animáció térben<br> való eltolása: Klikkeljünk a kívánt csatornán egy nem-kulcskocka mezõre (Ha lenyomva tartjuk a SHIFT gombot, akkor ezt több csatornán is megtehetjük), majd a szerkesztõablakban húzzuk az animációban résztvevõ réteget (és az animációt) a kívánt pozícióra. </span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Több Timeline használata</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Lehetõségünk van arra, hogy több Timeline-t alkalmazzunk egy dokumentumon belül, így könnyebben létrehozhatunk bonyolultabb animációkat, összetettebb viselkedéssel (ld. Viselkedés), amelyek bizonyos események hatására reagálnak.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Új Timeline hozzáadása a dokumentumhoz:<br> Válasszuk a Modify / Timeline / Add Timeline pontot.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Timeline-ok törlése:<br> Modify / Timeline / Remove Timeline.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Timeline-ok elemeire is használhatjuk az Edit menü Cut, copy, paste parancsait. Értelem szerûen egy adott objektum egy meghatározott pillanatban egyszerre csak egy helyen fordulhat elõ, ezért bizonyos helyekre nem tudunk beilleszteni objektumokat.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Megjegyzések</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Nagy képeket tartalmazó rétegeket ne mozgassunk, inkább szabdaljuk fel a képet, helyezzük el több rétegre, és ezeket a kisebbeket mozgassuk.<br> Ahelyett, hogy egy kép src tulajdonságát próbálnánk meg dinamikusan módosítani, helyezzük el a másik képet egy rejtett rétegen, és a megfelelõ helyen és idõben jelenítsük meg a rejtett réteget, és tüntessük el az eredeti képet tartalmazót. Ezzel a megoldással elkerülhetjük, hogy várakozni kelljen az új kép letöltésére, hiszen az oldal megnyitásakor a kép már letöltõdik a réteggel együtt, csupán nem látszik.<br> Simább animációkat hozhatunk létre, ha több képkockát használunk, és nagyobb fps értéket adunk meg. Az optimális hatás elérése érdekében érdemes több lehetõséget megpróbálni, majd megtekinteni különbözõ böngészõkben.<br> Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=Sablonok><span style='font-size:18.0pt;font-family:Arial;color:black'>Sablonok</span></a><span style='mso-bookmark:Sablonok'></span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sablonokat abban az esetben alkalmazunk, ha Site-unkon több oldalt készítünk ugyanolyan, vagy nagyon hasonló arculattal. Ilyenkor ahelyett, hogy minden egyes oldalnál megadnánk a megfelelõ beállításokat, beillesztenénk a kívánt helyre a megfelelõ elemeket a kívánt viselkedésekkel, létrehozunk egy sablont, majd a sablon alapján fogjuk létrehozni egyes oldalainkat. Az így létrehozott oldalak egyszerre módosíthatóak, ha magát a sablont fogjuk módosítani.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Amikor egy sablont hozunk létre tulajdonképpen megcsinálunk egy oldalt, és ezek egyes részeit szerkeszthetõvé tesszük, másokat nem.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Természetesen a sablonok azután is megváltoztathatóak, hogy dokumentumokat hoztunk létre belõlük. Ilyenkor a program fel fogja kínálni a lehetõséget, hogy frissíti a sablonból létrehozott oldalakat.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Tudni kell, hogy sablonaink mindig egy Site-hoz tartoznak.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sablonok létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Bármely dokumentum menthetõ sablonként (ilyenkor azonban mentés után majd még szerkeszthetõ területeket kell meghatároznunk hozzá). Ezt a File menü Save As Template pontjával tehetjük meg.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Új, üres sablont hozhatunk létre a Templates paletta (Window / Templates) New ikonjára klikkelve, vagy a Templates paletta menüjének a New pontját választva. Ilyenkor azonnal adjunk nevet a létrehozott sablonunknak, hogy a késõbbiekben könnyen tudjuk majd azonosítani.</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sablonok szerkesztése</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sablon szerkesztés üzemmódba a sablon palettán a szerkeszteni kívánt sablon nevére történõ dupla kattintásssal térhetünk át. (Másik módszer, hogy kiválasszuk a szerkeszteni kívánt sablont, majd az Open ikonra klikkelünk.)</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sablon szerkesztése közben a <<Template>> felirat látható az oldal neve elõtt az ablak címsávjában.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Oldalbeállítások (Modify / Page Properties)</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Title beállítás kivételével a késõbbiekben a sablonból létrehozott oldalak tulajdonságainál történt változtatások figyelmen kívül maradnak. Ha ezeket meg akarjuk a késõbbiekben változtatni, vagy a sablont kell megváltoztatnunk, vagy az adott oldalt kell leválasztanunk a sablonról.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Szerkeszthetõ- és zárolt területek</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Minden sablonban vannak szerkeszthetõ (Editable) és nemszerkeszthetõ (Locked) területek, objektumok. A szerkeszthetõ részeket, tartalmukat szabadon változtathatjuk a sablonból létrehozott dokumentumokban. A zárolt részek a sablonból létrehozott oldalakon nem módosíthatók. (Természetesen a sablon szerkesztése közben zárolt területeket is szabadon megváltoztathatunk.)</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Alapértelmezésként az egész sablon zárolt, nem rendelkezik egyetlen szerkeszthetõ területtel sem!</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha olyan sablonból akarunk létrehozni dokumentumot, amely nem rendelkezik szerkeszthetõ részekkel, a program rá fog kérdezni, hogy ezt valóban meg akarjuk-e tenni.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Tehát ahhoz, hogy sablonaink használhatóak legyenek, szerkeszthetõ részeket kell meghatároznunk, beszúrnunk.</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Szerkeszthetõ területek meghatározása</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Válasszuk ki azt a részt, amit szerkeszthetõvé akarunk tenni.<br> Válasszuk a Modify / Templates / Mark Selection Editable pontot<br> A megjelenõ dialógus ablakban adjunk egy nevet a szerkeszthetõ területnek<br> Táblázatok esetében szerkeszthetõvé tehetõ maga a táblázat, illetve celláinak tartalma. Egyszerre csak egy cellát tehetünk szerkeszthetõvé, ha többet akarunk, jelöljük ki egyesével õket, és minden egyes cellára külön alkalmazzuk a fent leírtakat. Ha a táblázatot szerkeszthetõvé tesszük, akkor csak magát a táblázatot tudjuk majd módosítani, tartalmát nem. Ha csak a tartalom szerkeszthetõ, a táblázat beállításait nem fogjuk tudni megváltoztatni.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Új szerkeszthetõ terület létrehozása</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Vigyük a kurzort oda, ahová szerkeszthetõ területet akarunk beilleszteni.<br> Válasszuk a Modify / Templates / New Editable Region pontot.<br> Adjunk egy nevet a szerkeszthetõ területnek (Ez a név majd kapcsos zárójelekben fog megjelenni a sablonban, ide majd valamilyen tartalmat szúrhatunk be). </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Zárolás</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Lehetõségünk van a már szerkeszthetõvé alakított területek zárolására, ehhez válasszuk a Modify / Templates / Unmark Editable Region pontot, majd jelöljük ki a listából a megfelelõ terület nevét.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Sablonokkal kapcsolatos beállítások (Edit / Preferences / Highlighting)</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Beállítható a szerkeszthetõ (Editable Regions), illetve a Zárolt (Locked Regions) területek kiemelésére használt szín.<br> A kiemelés csak akkor fog megtörténni, ha a View / Invisible Elements be van kapcsolva.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A sablonok szerkesztésénél a szerkeszthetõnek meghatározott területek lesznek csak kiemelve a beállított színnel. Természetesen a többi részt is szabadon módosíthatjuk, amíg a sablont szerkesztjük.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A sablonból létrehozott dokumentumban csak a zárolt területek lesznek kiemelve a meghatározott színnel, ezek szerkesztése nem lehetséges.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A kiemelés a HTML kódban is megtörténik. A szerkeszthetõ területek a  és az<br> <-- #EndEditable --> megjegyzések között találhatók.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Dokumentumok léterehozása sablonok alapján</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha egy sablon alapján akarunk új dokumentumot létrehozni, használjuk a File / New From Template pontot, majd válasszuk ki az adott Site-hoz tartozó, alkalmazni kívánt sablont.<br> Másik megoldás, ha létrehozunk egy új oldalt (File / New), majd alkalmazzuk rá az adott sablont; a sablon a palettárol a dokumentumba történõ húzásával.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sablonok alkalmazása létezõ dokumentumokra</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Modify / Templates / Apply to Page<br> A Templates Palettáról az alkalmazni kívánt sablont a dokumentumba húzzuk<br> A palettán kiválasztjuk a megfelelõ sablont, majd az Apply gombra klikkelünk.<br> Ilyenkor a sablon tartalma hozzáadódik az oldalhoz.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha egy másik sablon alkalmazva volt az oldalra, a program megnézi, hogy vannak-e azonos nevû területek, és ilyenkor megpróbálja a megfelelõ részeket behelyettesíteni. Ha vannak olyan területek a régi sablonban (részek az oldalon), amely az alkalmazni kívánt sablonban nem szerepelnek, akkor a DreamWeaver rákérdez, hogy ezeket törölje, vagy vegye bele az új sablonba. Ha az új sablonban több szerkeszthetõ terület van, mint a dokumentumban volt, ezek egyszerûen hozzáadódnak az oldalhoz.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Dokumentumok leválasztása az õket létrehozó sablonról</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A leválasztást a Modify / Templates / Detach from Sablon.dwt ponttal tehetjük meg. Ilyenkor az oldal teljes egészében szerkeszthetõvé válik, de innentõl kezdve nem lehetséges a dokumentum sablon alapján történõ frissítése.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Dokumentumok frissítése</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha megváltoztatunk egy sablont, a program végignézi, hogy mely dokumentumaink állnak kapcsolatban vele, és felkínálja azok automatikus frissítését. Amennyiben itt nem végeznénk el ezt, a késõbbiekben is lehetõségünk nyílik rá a Modify / Templates / Update Current Page (Éppen aktuális oldal frissítése), ill. Update Pages (több oldal frissítése) pontok alkalmazásával.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Több oldal frissítése:<br> - Look in: Hol keresse a program a frissítendõ oldalakat - Entire Site: Egy a mögötte lévõ listából kiválasztott teljes Site-on belül.<br> - Files That Use: Az adott Site-on belül az olyan file-okat keresse, amelyek a listából kiválasztott sablont használják.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>FONTOS:<br> Ha megváltoztatjuk egy sablon nevét, frissítés elõtt újra alkalmaznunk kell azt a kívánt oldalakra!</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Megjegyzések</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sablonok tartalmazhatnak Timeline-okat, CSS stílusokat, viselkedéseket. Mivel ezek a Fejléc (HEAD) mezõ elemei (a viselkedések csak részben), ezért azok módosítása nem lesz lehetséges a sablon alapján létrehozott dokumentumokban, hiszen ezekben a Fejléc mezõ elemei közül csak a Title szerkeszthetõ.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=Library><span style='font-size:18.0pt;font-family:Arial;color:black'>Library</span></a><span style='mso-bookmark:Library'></span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Libraryben (Könyvtár) elemeket (pl.: Képek, szövegek, hivatkozások, egyéb objektumk) tárolhatunk el. Olyan elemeknél szoktuk használni, amelyek többször elõfordulnak oldalainkon. A Libraryben tárolt elemeket nevezzük Library Itemeknek.<br> Amikor a Librarybõl egy elemet illesztünk az oldalba, a DreamWeaver beilleszti az adott elemhez tartozó HTML kódot, és tesz egy megjegyzést magának, hogy ez a beillesztett kód egy külsõ objektumhoz tartozik, így lehetõséget biztosít, hogy ha magát a Library Itemet változtatjuk meg, akkor a beillesztett részeket automatikusan frissíteni tudja.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Fontos, hogy a sablonokhoz hasonlóan, egy Library is egy Site-hoz tartozik.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Library Itemek létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Válasszuk ki az adott elem(ek)et, ami(ke)t Library Itemmé kívánunk alakítani<br> A kijelölt részt húzzuk át a Library palettára, vagy a paletta menüjébõl válasszuk a New Library Item pontot, vagy kattintsunk a palettán a New ikonra (ha ezek egyike sem tetszik, választhatjuk a Modify menü Library / Add Object to Library pontját is).<br> Adjunk egy nevet a létrehozott Library Itemnek.<br> FONTOS:<br> Csak olyan dolgokat illeszthetünk be a Librarybe, amelyek a dokumentum törzs (BODY) részébe beilleszthetõk. A külsõ erõforrásokra (pl.: képek) csak hivatkozik a program, tehát ahhoz, hogy ezek megfelelõen beilleszthetõek legyenek, az adott erõforrásoknak létezniük kell a megfelelõ helyen!</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Library Itemek beillesztése az oldalra</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A beillsztéshez a Library palettáról húzzuk a kívánt elemet a dokumentum megfelelõ helyére, vagy állítsuk a kurzort a szerkesztõablakban a beszúrás helyére, majd a palettán az elem kiválasztása után kattintsunk az Insert gombra.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha el akarjuk kerülni, hogy az adott rész Library Itemként történjen beillesztésre - nekünk csak a HTML kódra van szükségünk-, akkor tartsuk lenyomva a CTRL billentyût beillesztés közben. Az így beillesztett elemek nem Library Itemként fognak kezelõdni, tehát automatikus frissítésük nem lehetséges.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Library Itemek módosítása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Válasszuk ki a szerkeszteni kívánt elemet a palettán.<br> Klikkeljünk az Open ikonra, vagy válasszuk a paletta menüjébõl az Edit parancsot.<br> Szerkesszük át az elem(ek)et a kívánt formára.<br> A File menü Save pontjával mentsük el a változtatásokat.<br> A dialógus ablakban határozzuk meg, hogy frissíteni akarjuk-e megváltoztatott elemet tartalmazó dokumentumaink tartalmát, vagy sem (ez a sablonoknál leírtakhoz hasonlóan történik). Amennyiben nem akarunk frissíteni, ezt a késõbbiekben is megtehetjük a Modify / Library / Update Pages pontban. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Library Itemek törlése</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Válasszuk ki a palettán a törölni kívánt elemet<br> A paletta menüjébõl válasszuk a Delete pontot, vagy klikkeljünk a Kuka ikonra.<br> FONTOS:<br> Attól függetlenül, hogy törlünk egy elemet, az adott elemet tartalmazó dokumentumok tartalma nem változik.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Library Item-ek szerkeszthetõvé tétele a dokumentumban</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Egy Library Item-et szerkeszthetõvé tehetünk, ha az adott kódot leválasztjuk a Libraryrõl. Ezt az elemet a dokumentumban kiválasztva, majd a Properties palettán a Detach From Original gombra klikkelve tehetjük meg. Természetesen ilyenkor, mivel töröltük az elemre való hivatkozást, az adott Library Item módosításakor ez a rész nem fog frissítésre kerülni.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Libraryvel kapcsolatos beállítások (Edit / Preferences / Highlighting / Library Items)</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Megadhatunk egy színt, amit a program a Library Itemek kiemelésére fog használni. A kiemelés csak akkor történik meg, ha a View / Invisible Elements be van kapcsolva.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=Viselkedések><span style='font-size:18.0pt;font-family:Arial;color:black'>Viselkedések </span></a><span style='mso-bookmark:Viselkedések'></span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Viselkedések (Behaviors) alkalmazásával lehetoségünk nyílik arra, hogy a felhasználó cselekedetei hatására változások történjenek oldalunkon. A DreamWeaver a viselkedések megteremtéséhez JavaScript-et használ. (Egyébként ez nem csak JavaScripttel, hanem más, kliens oldali scriptnyelvek segítségével – pl.: VBScript - illetve appletek, Flash mozik, stb. alkalmazásával is lehetséges.)</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Viselkedések három részbol állnak:<br> - Akció: Ez maga a változás, ami valamilyen esemény hatására történik.<br> - Esemény: Minden akcióhoz tartozik egy esemény, az adott akció ennek hatására fog lejátszódni. Egy eseményhez több akciót is kapcsolhatunk, ilyenkor azok a meghatározott sorrendben fognak lejátszódni.<br> - Elem: Az a dolog, amihez az események és a hozzájuk tartozó akciók kötodnek. Egy elemhez több ilyen esemény-akció páros is kötheto. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> FONTOS:<br> A lejátszódó akciók nem feltétlen a felhasználó cselekedeteire jönnek létre, más, tolük független események is kiválthatják az akció végrehajtását (pl.: az akció egy kép letöltodésekor játszódik le).<br> Tudni kell, hogy nem minden böngészo támogat minden eseménykezelot, illetve azok használatát bizonyos elemeken.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Behaviors paletta (Window / Behaviors)</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- + gomb: Akció hozzáadása. Maga az akció a rákattintás után megjeleno menübol választható ki.<br> - - gomb: Akció törlése. Válasszuk ki a törölni kívánt akciót, majd kattintsunk rá.<br> - Events for: Ebben a legördülo menüben állíthatjuk be, hogy milyen eseménykezeloket alkalmazhatunk. Minden büngészo más-más eseménykezelokkel rendelkezhet fajtától, ill. verziótól függoen.<br> - Le, fel nyilak: Ezek segítségével állíthatjuk be az ugyanazon esemény hatására bekövetkezo akciók lejátszódási sorrendjét.<br> - A használni kívánt eseménykezelot az akció elott található legördülo menübol választhatjuk ki. </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> A paletta címsorában láthatjuk az elemet (pl.: <img>), amihez a viselkedést kötni akarjuk.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><b><span style='font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php##">Eseménykezelok</a></span></b><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Viselkedés illesztése egyes elemekhez</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Válasszuk ki a kívánt elemet (Ha az egész dokumentumot akarjuk, klikkeljünk a státusz soron lévo <body> tag-re).<br> Nyomjuk le a + gombot a palettán<br> Válasszuk ki a megfelelo akciót<br> Adjuk meg az akció paramétereit<br> Ha az alapértelmezett eseménykezelo nem megfelelo számunkra, válasszunk egy másikat az akció elott található legördülo menüben. Egyes eseménykezelok zárójelben vannak. Ez azt jelenti, hogy ahhoz, hogy az adott eseménykezelo muködjön, valahogy át kell alakítani az adott elemet (pl. képekbol hivatkozást kell csinálni, hogy az onMouseOver muködjön). A zárójeles eseménykezelo választásakor a program automatikusan elvégzi a szükséges módosításokat. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Viselkedés illsztése Timeline-okhoz</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Timeline B csatornáján kattintsunk duplán arra a képkockára, ahol a viselkedést el kívánjuk helyezni.<br> Válasszuk ki az alkalmazni kívánt akciót, adjuk meg paramétereit. Természetesen az akciók nem csak a Timeline elemeire lehetnek hatással, hanem az oldalon található bármely objektumra. </span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> A Timeline-okhoz rögzített egyetlen lehetséges eseménykezelo az onFrameX.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A hozzárendelt akciók megváltoztatása</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Egy akció paramétereit megváltoztathatjuk, ha a Behaviors palettán duplán kattintunk a kívánt akcióra.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Az egyes akciók használata</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Call Javascript:<br> Javascript parancsot, vagy egy általunk megírt funkciót hívhatunk meg segítségével. A hívás az eval parancs segítségével kerül kiértékelésre.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Change Property:<br> Egy elem tulajdonságai változtathatók meg segítségével. Bizonyos böngészok bizonyos elemekre nem képesek alkalmazni. A megjeleno párbeszéd ablakban eloször válasszuk ki a megváltoztatni kívánt objektum típusát, majd magát az objektumot. Ezután válasszuk ki a legördülo menübol, vagy adjuk meg manuálisan a megváltoztatni kívánt tulajdonságot. A New Value pontban adjuk meg a tulajdonság új értékét.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Check Browser:<br> Használatával megállapíthatjuk, hogy a felhasználó milyen böngészovel tekinti meg oldalunkat, és az eredménytol függoen automatikusan egy másik oldalt tölthetünk be számára. A Netscape… melletti szövegmezoben beállíthatjuk, hogy a Netscape Navigator megadott verziója, ill. késobbi esetén maradjunk ezen a lapon (Stay on this Page), ugorjunk egy URL-re (Go to Url), vagy ugorjunk egy alternatív URL-re (Go to Alternate URL). Az alatta lévo sorban megadhatjuk, mi történjen abban az esetben, ha a Netscape a megadott verziószámnál kisebb. Ugyanezen beállításokat elvégezhetjük Internet Explorerre, illetve egyéb böngészokre (bár ezeknél a verziószám érzékelés kimarad). Az URL, ill. Alt URL pontokban határozzuk meg a fenti beállításokhoz használt hivatkozásokat.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Check Plugin:<br> Átirányíthatjuk a böngészot egy másik oldalra, attól függoen, hogy bizonyos Plugin (ill. Flash és Shockwave esetén Active-X vezérloelem) telepítve van-e a kliens gépen. A Plugin pontban kiválaszthatjuk (Select), vagy manuálisan megadhatjuk (Enter) az ellenorizni kívánt Plugin-t.<br> Az If Found, Go to URL pontban adjuk meg annak az oldalnak a címét, amelyet akkor akarunk megjeleníteni, ha a kliens gép rendelkezik a keresett Plugin-nel. (Ennek a pontnak a meghatározása nem kötelezo.) Amennyiben nem találtunk megfelelo Plugint, az ez alatt megadott oldalt fogja a böngészo megjeleníteni.<br> Az alsó jelölonégyzetet bekapcsolva - amennyiben az ellenorzés valamilyen oknál fogva nem lehetséges,- mindig arra a hivatkozásra fog a böngészo ugrani, amit arra az esetre adtunk meg, hogy a keresett Plugin megvan.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Control Shockwave or Flash:<br> Használatához kell, hogy legyen az oldalon egy beillesztett, névvel rendelkezo Shockwave, vagy Flash mozi. A Movie pontban kiválaszthatjuk, hogy melyik mozival akarunk dolgozni.<br> Az Action részen határozzuk meg, hogy az adott mozival mi történjen:<br> Play: Lejátszás folytatása<br> Stop: Lejátszás leállítása<br> Rewind: Mozi visszatekerése az elso képkockához<br> Go to Frame: Megadott képkockához ugrás a moziban. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Drag Layer<br> Rétegek Drag&Drop típusú mozgatására használjuk. Legcélszerubb ezt az akciót a BODY elemmel összekapcsolni egy onLoad eseménykezelo segítségével. Ez azért fontos, mert a scriptnek még azelott le kell futnia, hogy a felhasználó megpróbálná a meghatározott réteget mozgatni.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Basic rész: - Layer: A réteg neve, amihez megadjuk a mozgatásával kapcsolatos paramétereket.<br> - Movement: A mozgás típusa - Unconstrained: Szabad<br> - Constrained: Behatárolt. Ebben az esetben a megjeleno szövegmezokben definiálhatunk egy, a réteg kezdeti helyzetéhez viszonyított mozgási teröletet (px).<br> <br> - Drop Target: Egy célpontot adhatunk meg a réteg "ledobásához". A Get Current Position gomb használatával lekérhetjük az adott réteg aktuális pozícóját.<br> - Snap If Within: Itt egy értéket adhatunk meg pixelben, és ha a réteg ledobás elotti távolsága ezen az értékhatáron belül van a Drop Target pontban megadott koordinátákhoz képest, akkor a réteg a Drop Targetnél megadott pontba fog igazodni.<br> <br> - Advanced rész: - Drag Handle: - Entire Layer: A réteg területén belül bárhol megragadhatjuk azt.<br> - Area Within<br> Layer: A réteg "megragadása" csak területének egy meghatározott részén lesz lehetséges. Ezt a részt tudjuk megadni a megjeleno szövegmezokben (px).<br> <br> - While Dragging: Mozgatás közben mi történjen: - Bring<br> to Front: Bejelölve mozgatás közben a réteg Z-indexe átállítódik, hogy ez legyen a legmagasabb (ez a réteg legyen legfelül).<br> - Then: Ebben a menüben határozzuk meg, hogy a mozgatás végeztével mi történjen a réteggel: - Leave on<br> Top: Maradjon legfelül.<br> - Restore<br> Z-index: Álljon vissza eredeti magasságába<br> <br> - Call<br> Javascript: Javascript meghívása mozgatás közben (pl. akkor alkalmazzuk, ha mozgatás közben mindig ki akarjuk valahová írni a réteg éppen aktuális koordinátáit).<br> <br> - When Dropped<br> Call Javascript: Lerakáskor Javascript hívása.<br> - Only if Snapped: Ezt a pontot bejelölve csak akkor lesz meghívva a fentebb megadott JS, ha a réteg a mozgatás befejeztével a Drop Target pontba került.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Go To URL:<br> Megadott URL betöltése a kiválasztott ablakokba, frame-ekbe. Minden egyes Frame-nek, ill. ablaknak külön megadhatjuk, hogy milyen URL-t jelenítsen meg.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Jump Menu, Jump Menu Go:<br> Lásd: Formanyomtatvány elemek – Jump Menu</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Open Browser Window:<br> Egy adott URL-t jeleníthetünk meg egy új böngészo-ablakban. A létrejövo ablaknak beállíthatjuk szinte az összes tulajdonságát.<br> - URL to Display: Az új ablakban megjelenítendo hivatkozás<br> - Window width: A létrejövo ablak szélessége<br> - Window height: Magassága<br> - Attributes: Az új ablak tulajdonságait állíthatjuk itt be, egyszeruen jelöljük be az ablak megjeleníteni kívánt részeit.<br> Window Name: A létrehozandó ablak neve. Ez alapján tudunk majd a késobbiekben a létrejött ablakra hivatkozni, ha valamit meg akarunk jeleníteni benne. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha nem adunk meg méreteket a létrehozandó ablakhoz, akkor a méretek, tulajdonságok meg fognak egyezni az eredeti ablak méreteivel és tulajdonságaival.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Play Sound:<br> Hangokat, zenét játszhatunk le a segítségével. Használatához a kliensnek rendelkeznie kell az adott hangformátum lejátszását biztosító pluginnel. A hangfile meghatározásához adjuk meg az elérési útvonalát (vagy Internetes címét) a párbeszéd ablakban.</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Popup-message:<br> Egy általunk definiált szöveggel rendelkezõ üzenet-ablakot jeleníthetünk meg segítségével. A megjelenõ ablak csak egy OK gombbal fog rendelkezni. Tájékoztató szövegek megjelenítésére szoktuk használni ezt az akciót.<br> Kapcsos zárójelek között JavaScript funkciókat, tulajdonságokat, globális változókat, kifejezéseket is beillszthetünk az üzenetablakba (pl.: Az oldalon található hivatkozások száma: {document.links.length}).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Preload Images<br> Elõre letölthetjük használatával az alaphelyzetben az oldalon meg nem jelenõ képeket, így ha valamilyen dinamikus képcserét végzünk majd a dokumentumban, nem kell várnunk az új kép letöltõdésére, hiszen az már benne lesz a böngészõ cache-ében.<br> Ezt az akciót a BODY taghez érdemes illeszteni onLoad eseménykezelõvel.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Set Nav Bar Image:<br> A Nav Bar objektum(Object paletta / Navigation Bar):<br> Segítségével egy navigációs menüt készíthetünk oldalunkra</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Nav Bar Elements: A navigációs menü elemei, sorrendjük.<br> - Element Name: Az adott elem neve, Ez a JavaScript alkalmazás miatt fontos.<br> - Up Image: A menü-elemhez tartozó kép (alapállapot).<br> - Over Image: Az a kép, ami akkor jelenik meg, ha a menüelem fölött tartózkodunk a pointerrel.<br> - Down Image: A menüpontra klikkelve megjelenítendõ kép.<br> - Over While Down: Ez a kép jelenik meg, ha az adott menüelemen lenyomva tartjuk az egérgombot.<br> - When Clicked Go<br> to URL: Az elemre történt kattintás hatására megjeleníteni kívánt hivatkozás.<br> - In: A frame, vagy ablak, amiben a megadott hivatkozást meg akarjuk jeleníteni.<br> - Options: Egyéb beállítási lehetõségek: - Preload Images: A különbözõ állapotokhoz tartozó képek elõre letöltése (ld. Preload Images akció).<br> - Show Down Image<br> Initially: Alaphelyzetben a menüponthoz tartozó képek közül a lenyomott állapothoz hozzárendelt jelenjen meg.<br> <br> - Insert: A beillesztésnél használt elrendezés: - Horizontally: Vízszintes elhelyezés<br> - Vertically: Függõleges elhelyezés<br> <br> - Use Tables: Bekapcsolva az elemek egy táblázatba rendezve fognak beillesztésre kerülni. </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Az akció:<br> A navigációs menü elemeinek különbözõ állapotaihoz tartozó képek, ill. a megjeleníteni kívánt URL dinamikus megváltoztatására használjuk.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A hozzá tartozó Basic rész használata megegyezik a Navigation Barnál leírtakkal.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Advanced:<br> A legördülõ menübõl kiválaszthatunk egy állapotot, és ha az adott menüpont a kiválasztott állapothoz tartozó képet mutatja, megadhatjuk az Also Set pontnál, hogy a többi elem milyen állapotba kerüljön (illetve milyen képet jelenítsen meg).</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Navigation Bar-on egy ikonra klikkelve az össze többi Up helyzetbe fog kerülni alapértelmezett helyzetben. Ha ezt el akarjuk kerülni, akkor a Set NavBar Image akciót kell használnunk.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Set Text of Frame:<br> Egy frame-hez tartozó HTML kódot alakíthatunk át vele. Lehetõségünk van a dinamikusan létrehozandó kódba különbözõ scriptek beillesztésére is.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A Get Current HTML gombot lenyomva az adott frame éppen aktuális HTML kódját tudjuk lekérni.<br> Ha bekapcsoljuk a Preserve Background Color mezõt, az új változat meg fogja tartani az eredeti háttér, szöveg, ill. link színeit.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Set Text of Layer:<br> Ugyanaz, mint a Set Text of Frame, de itt egy réteg tartalmát módosíthatjuk.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Set Text of Status Bar:<br> Ezzel a böngészõ státuszsorának szövegét változtathatjuk meg. Értelemszerûen ide képek (<img>) nem szúrhatóak be. Itt is van lehetõségünk kapcsos zárójelek között JavaScript beillesztésre (ld.: Popup-Message).</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Set Text of Textfield:<br> Egy, az oldalon található szövegmezõ tartalmát változtathatjuk meg segítségével.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Show / Hide Layers:<br> Rétegeket tüntethetünk el, vagy jeleníthetünk meg alkalmazásával. Minden egyes rétegnek (bármelyik frame-ben is vannak) megadhatjuk, hogy látható (Show), vagy rejtett (Hide) legyen, ill. láthatósága ne változzon (Default).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Swap Image:<br> Képek dinamikus cseréje hajtható végre vele a kép objektumok src (forrás) tulajdonságának megváltoztatásával. Fontos, hogy a torzulás elkerülése érdekében ugyanakkora képet adjunk meg cserének.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Az akció használata elõtt nevet kell adni a kívánt Image objektumoknak!</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Images: Itt választhatjuk ki, hogy melyik képen akarunk változtatni.<br> - Set Source to: Megadjuk az új kép helyét.<br> - Preload Images: Bekapcsolva elõre letöltjük a csereképet is.<br> - Restore Images<br> onMouseOut: Bekapcsolva az MouseOut esemény hatására a képek visszaállnak eredeti helyzetükbe. </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Swap Image Restore:<br> Az adott elemen az utoljára végrehajtott Swap Image akció utáni állapotot állítja vissza az azt megelõzõbe.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Go To Timeline Frame:<br> Használatával a Timeline egy általunk megadott képkockájához ugorhatunk.<br> - Timeline: Megadjuk, hogy melyik Timeline-nal dolgozunk.<br> - Go To Frame: Meghatározzuk, hogy hanyadik képkockára akarunk ugrani.<br> - Loop: Ez a bizonyos ugrás hányszor történjen meg egymás után. </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> FONTOS:<br> A loop mezõhöz CSAK akkor rendeljünk értéket, ha a viselkedést az adott Timeline egyik képkockájához csatoltuk!</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Play Timeline:<br> Egy megadott Timeline lejátszását kezdhetjük meg, vagy folytathatjuk vele.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Stop Timeline:<br> Megállíthatjuk a kiválasztott (ill **ALL TIMELINE ** esetén az összes) Timeline lejátszását (Play Timeline akció hatásaként innen fog az animáció folytatódni).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Validate Form:<br> Egy formanyomtatvány szöveges részeinek kitöltésének helyességét ellenõrizhetjük az akció segítségével. Ezt az akciót köthetjük az adott FORMhoz egy onSubmit eseménykezelõvel, vagy az egyes mezõkhöz onChange, vagy onBlur eseménykezelõ alkalmazásával.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Named Fields: Az ellenõrizendõ mezõ(k).<br> - Value Required: Bekapcsolva az adott mezõ üres értéket nem fog elfogadni.<br> - Accept: Az alpontokban határozhatjuk meg, hogy milyen értéket fogad el helyesnek a FORM. - Anything: Bármit<br> - Number: Bármilyen számot (római számokat persze nem).<br> - Email address: Bármilyen olyan karaktersorozatot, amiben megtalálható a @ karakter.<br> - Number from to: A két megadott számérték közötti számokat.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Megjegyzések</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Természetesen az alkalmazható akciók száma korlátlan, lehetõségünk van saját akciók megírására is.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'>  <a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=HTMLStílusok><span style='font-size:18.0pt;font-family:Arial;color:black'>HTML-Stílusok (DW3)</span></a><span style='mso-bookmark:HTMLStílusok'></span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A HTML- stílus kifejezésen egy vagy több HTML formázó tag (pl.: <B>, <I>, <P align="center">) alkalmazását értjük egy adott szövegrészen belül.<br> Ugyanezzel a formázási technikával messze nem tudjuk utolérni a CSS-stílusok nyújtotta lehetõségeket, de mivel tulajdonképpen csak HTML tag-ek különbözõ kombinációját alkalmazzuk a formázáshoz szinte bizonyos, hogy minden böngészõben a kívánt eredményt fogjuk elérni.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A HTML-stílusokat szöveg- ill bekezdések formázására tudjuk használni. Mondhatni, létrehozunk egy formázás-köteget, és ezt alkalmazzuk a meghatározott részen.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A CSS stílusokkal ellentétben egy stílus megváltoztatásakor a stílus alapján létrehozott szöveg, ill. az olyan szövegek, amelyekre a stílust alkalmaztuk, nem fognak "frissülni".</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A HTML-Styles paletta</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Kétféle HTML-stílus létezik: Sorközi (kijelölt szövegrészre érvényesül), és blokk-szintû (egész bekezdésre hat).</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Az egyes stílusfajták a palettán (blokk szintû), vagy a (sorközi) képekkel vannak jelölve. Amenyiben az ábra mellett egy + jelet is találunk, ez azt jelenti, hogy a stílus "hozzá fog adódni" az elõzõleg alkalmazott(ak)hoz, nem fogja felülírni azokat.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A paletta menüje:<br> - Edit: Ez maga a változás, ami valamilyen esemény hatására történik.<br> - Duplicate: Másolat létrehozása egy stílusról<br> - Delete: Törlés<br> - Apply: Alkalmazása a kijelölésre </span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>HTML-stílusok alkalmazása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sorközi stílus esetén jelöljük ki a szövegrészt, amire a stílust alkalmazni akarjuk; blokk-szintûek esetén vigyük a kurzort valahová a blokk területén belülre, majd a palettán válasszuk ki a kívánt stílust és kattintsunk az Apply gombra. (Amennyiben a gomb elõtti jelölõnégyzet ki van pipálva, ez nem szükséges, a kijelöléskor az adott stílus automatikusan alkalmazásra kerül.)</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>HTML-stílus létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Egy új stílus létrehozásához kattintsunk a paletta menüjére, majd válasszuk a New pontot.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Name: A létrehozott stílus neve.<br> - Apply to: Itt állítjuk be, hogy a stílus sorközi (Selection), ill. blokk-szintû (Paragraph) lesz.<br> - When<br> Applying: Beállíthatjuk, hogy a stílus alkalmazásakor hozzáadódjon az eddigiekhez (Add to Existing Style), vagy írja felül a már meglévõ formázási paramétereket (Clear Existing Style).<br> - Paragraph<br> attributes: Beállíthatjuk a blokk típusát (Format), és igazítását (Alignment). </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:#444444'> <o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><a name=CSS-stílusok><span style='font-size:18.0pt;font-family:Arial;color:black'>CSS-stílusok</span></a><span style='mso-bookmark:CSS-stílusok'></span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>CSS stílusok segítségével szinte bármilyen objektum megjelenítését szabadon tudjuk befolyásolni. Lehetõségünk van a stílusainkat egy külsõ file-ban, egy úgynevezett stíluslapon eltárolni, majd ezt alkalmazni oldalainkra. Megtehetjük, hogy az egyes HTML tagek megjelenítési tulajdonságait atformáljuk (pl.: a H1 nem nagy méretû, félkövér karaktereket fog használni, hanem egy 18 pontos középre igazított, sötétkék színû, villogó feliratot).<br> Alkalmazásukkal olyan formázási lehetõségeink is adódnak, amelyek pusztán HTML nyelv alkalmazásával nem lennének lehetségesek (pl beállíthatjuk a szövegekben a szavak közötti távolságot cm-ben megadva).</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Sajnos a CSS-stílusok használatát csak a 4.0 ill. annál nagyobb verziószámú böngészõk támogatják, de ezek sem képesek minden formázási lehetõséget megjeleníteni, illetve nem mindegyik böngészõ jeleníti meg õket pontosan.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A CSS a HTML-hez hasonlóan egy leíró nyelv, több verziója létezik (CSS1, CSS2). A DreamWeaver a CSS1 specifikációt használja.</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A CSS-stílusokat három csoportba oszthatjuk:</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Egyedi stílusok (Custom Style)<br> - HTML tageket felüldefiniáló stílusok (Redefine HTML tag)<br> - CSS választó stílusok (CSS-Selector)<br> A CSS stílusok alkalmazása egy kicsit körülményesebb, mint a HTML formázás, hiszen bármely egyedi stílust bármelyik elemre ráhúzhatjuk, de bizonyos meghatározásoknál bizonyos paramétereknek az adott objektumok esetén nincs értelmük, ezért elég kiszámíthatatlan hatásokat érhetünk el helytelen használatukkal.<br> Pl.: Egy képre ráhúzunk egy stílust, ami az adott szöveges részt hivatott villogóvá tenni.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>CSS Stílusok létrehozása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>CSS stílust a CSS paletta New ikonjára klikkelve, vagy a paletta menüjének New pontját választva hozhatunk létre.</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Elsõ lépésként válasszuk ki a létrehozandó stílus típusát:<br> - Custom Style: Egyedi stílus. Ha ezt a pontot válasszuk, a szövegmezõben adjunk egy nevet stílusunknak.<br> - Redefine HTML: HTML taget felülíró stílus. A legördülõ menübõl válasszuk ki, hogy melyik HTML tag felülírását akarjuk elvégezni.<br> - CSS-Selector: Itt egy stílust határozhatunk meg, amit abban az esetben fogunk használni, ha a HTML tagek bizonyos sorrendben követik egymást. A szövegmezõbe írjuk be szóközzel elválasztva az egymást követõ tag-eket. Pl.: td h1. </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Ha kiválasztottuk a megfelelõ stílust, és meghatároztuk a szükséges paramétereket, kattintsunk az OK gombra.</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Type – Karakterek formázása</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Font: Karakterkészlet típusa (lista).<br> - Size: Az alkalmazott karakterek mérete (px, pt, cm, mm, pica, stb.)<br> - Style: Beállíthatjuk, hogy sima, vagy dõlt betûs karaktereket akarunk alkalmazni<br> - Weight: A karakterek "kövérsége" (400: Normal, 700: Félkövér)<br> - Variant: Beállíthatjuk, hogy a karakterkészlet mely változatát akarjuk használni.<br> - Line Height: Megadhatjuk a sormagasságot. Ezt a beállítást jelenleg semelyik böngészõ sem támogatja<br> - Case: Betûméretek beállítása: - Capitalize: A szövegben minden szó elsõ karakterét nagybetûvé alakítja<br> - Uppercase: A szöveget csupa nagybetûvé alakítja<br> - Lowercase: Csupa kisbetû<br> - None: Betûméretekkel kapcsolatos beállítások elvetése<br> <br> - Decoration: A szöveg "díszítése": - Underline: Aláhúzás<br> - Overline: Föléhúzás<br> - Line-Through: Áthúzás<br> - Blink: Villiogás<br> - None: Dekorácók eltávolítása<br> <br> - Color: A szöveg színe </span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Backgrount – Hátterek formázása</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Background Color: Háttérszín<br> - Background Image: Háttérkép<br> - Repeat: Háttérkép ismétlésével kapcsolatos beállítások - No-repeat: Nincs ismétlés<br> - Repeat: Ismétlõdés mindkét irányban<br> - Repeat-X: A háttérkép csak vízszíntesen ismétlõdik.<br> - Repeat-Y: A háttérkép csak függõlegesen ismétlõdik.<br> <br> - Attachment: A háttérkép rögzítésével kapcsolatos beállítások<br> - Fixed: A háttérkép fix, nem scrollozódik a dokumentummal (mint bgproperties="fixed")<br> - Scroll: Az oldallal együtt mozog.<br> - Horizontal Position: Háttérkép vízszintes igazítása - Left: Balra<br> - Center: Középre<br> - Right: Jobbra<br> - (Value): Az adott objektum (oldal, táblázat, cella, réteg, stb.) bal szélétõl a megadott távolságra.<br> <br> - Vertical Position: Függõleges igazítás - Top: Felülre<br> - Center: Középre<br> - Bottom: Alulra<br> - (Value): A felsõ széltõl a megadott távolságra</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> A Horizontal- ill. Vertical Position pontoknál megadott beállításoknak csak akkor van értelmük, ha a háttér rögzítéséhez (Attachment) a fix pontot választottuk.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Block – Blokk szintû formázások</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Word Spacing: Szavak közötti távolság<br> - Letter Spacing: Betûk közötti távolság<br> - Vertical Alignment: A blokk függõleges igazítása, leggyakrabban a szülõ objektumhoz képest. Ld.:Képek, Alignment tulajdonság.<br> - Text-Align: Szöveg igazítása a blokkon belül: - Left: Balra zár<br> - Right: Jobbra zár<br> - Center: Középre igazított<br> - Justify Sorkizárt. (Ha ezt használjuk, felülbírálhatja a Letter, ill. Word Spacingnél megadott értékeket.)<br> <br> - Text-Indent: A blokk elején lévõ szöveg behúzásának mértéke.<br> - Whitespace: Szóköz, tabulátor karakterek kezelésének módja: - Normal: Mint HTML-ben<br> - Pre: Mint HTML elõreformázott blokk esetén<br> - Nowrap: Automatikus sortördelés kikapcsolása.</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Box – Elemek befoglalója</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Width: Befoglaló szélessége<br> - Height: Befoglaló magassága<br> - Float: Befoglaló szöveggel való körbefuttatásának módja - Left: ld. képek, alignment<br> - Right: ld. képek, alignment<br> - None: nincs körbefuttatás<br> <br> - Clear: Itt meghatározhatjuk, hogyha az adott befoglalónkat valamelyik oldalról egy másik elem, vagy szöveg elõz meg (vagy követ), akkor ezeket az új objektumokat új sorba rendezzük.<br> - Padding: A befoglaló bélelése. A befoglaló szélei és tartalmának szélei közötti távolság a megadott mértékegységben (ld.: Táblázatok, Cellpaddind)<br> - Margin: A befoglaló széle, és a befoglalót körülvevõ objektumok közötti távolság a különbözõ irányokban. </span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Border – Keretezés</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Width: Keret szélessége az egyes oldalakon<br> - Color: Keret színe az egyes oldalokon<br> - Style: Keret stílusa: - Solid: Tömör<br> - Double: Dupla<br> - Dotted: Pontozott<br> - Dashed: Szaggatott<br> - Outset: Kiemelkedõ<br> - Inset: Süllyesztett</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>List – Listák formázásai</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Type: Lista típusa (Az egyes típusokról bõvebben ld. Listák)<br> - Bullet Image: Rendezetlen lista esetén egy képet rendelhetünk a lista pontjait jelképezõ ikon helyére<br> - Position: A lista pozícionálása, azaz az új sorba kerülõ szöveg bal széle mihez legyen igazítva - Inside: Igazítás a listaelem-jelhez.<br> - Outside: Igazítás az éppen aktuális behúzáshoz</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Positioning – Elhelyezés az objektumok rétegre másolásával</span><span style='font-size:9.0pt; font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- Type: Az elhelyezés módszere: - Absolute: A létrejövõ réteg koordinátáit az oldal bal felsõ sarkához viszonyítjuk<br> - Relative: A megadott koordinátákat az objektum aktuális pozíciójához képest értelmezzük<br> - Static: A megadott koordinátákat nem vesszük figyelembe, az új réteg mindig pontosan ott jön létre, ahol az eredeti objektum elhelyezkedik<br> <br> - Visibility: A létrejövõ réteg láthatóságát állíthatjuk be ebben a pontban<br> - Overflow: ld. Rétegek tulajdonságai, Overflow tulajdonság<br> - Placement: Itt adhatjuk meg a koordinátákat, amelyeket a fentebb beállított viszonyítási alaptól függõen a réteg elhelyezésére fogunk használni, és a léterjövõ réteg szélességét, magasságát is ebben a pontban állítjuk be.<br> - Clip: Levágandó területek meghatározása (ld. Rétegek tulajdonságai, Clip) </span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>A létrehozott réteg típusát az Edit/Preferences Layers pontjánál megadott TAG beállítás határozza meg.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Extensions – Egyéb effektek</span><span style='font-size:9.0pt;font-family: Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>- PageBreak: Az oldal nyomtatásakor oldaltörés alkalmazása (Jelenleg nem támogatott) - Before: az objektum elõtt<br> - After: az objektum után<br> <br> - Cursor: Beállíthatjuk, hogy az objektum fölé állva milyen egérmutató jelenjen meg (csak IE4+) - Hand: Kéz<br> - Crosshair: Célkereszt<br> - Text: Szöveg<br> - Wait: Homokóra<br> - XYResize: Különbözõ irányú átméretezõ<br> <br> - Filter: Speciális effektek alkalmazása (IE4+) - Invert: Színek invertálása<br> - FlipH, FlipV: Vízszintes, függõleges tükrözés<br> - Stb. Szöveg</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>CSS stílusok alkalmazása</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Jelöljük ki azt a rész, ill. objektumot, amire a stílust alkalmazni akarjuk, majd a CSS palettán válasszuk ki az alkalmazni kívánt stílust, és klikkeljünk az Apply gombra.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Külsõ stíluslapok létrehozása</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Hozzuk létre az oldalon az összes CSS stílust, majd válasszuk a File / Export / Export CSS Styles pontot.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Külsõ stíluslapok alkalmazása</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Kattintsunk a CSS paletta Edit ikonjára, majd a menübõl a Link gombra.<br> File / Url: Itt adjuk meg a stíluslap helyét, vagy Internet-címét<br> Add as: Meghatározzuk a csatolás módját - Link: Csatolás<br> - Import: Behozatal</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'><br> Az Import beilleszti a stíluslap tartalmát az aktuális dokumentumba, a Link eléri és továbbítja az információkat. A Link opcióval való csatolás sokkal elterjedtebb, támogatottabb, több lehetõséget biztosít.</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>CSS stílus ütközések</span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Ha két stílust használunk egy adott rész formázására, és azok:</span><span style='font-size: 9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p><span style='font-size:9.0pt;font-family:Arial;color:black'>Nem ütköznek, akkor mindkét stílus érvényesülni fog.<br> Ütköznek (két CSS stílus), akkor az adott részhez a HTML kódban közelebb található stílus fog érvényesülni.<br> Ütköznek (HTML és CSS), akkor a CSS stílus érvényesül.<br> Vissza a tartalomhoz</span><span style='font-size:9.0pt;font-family:Arial; color:#444444'><o:p></o:p></span></p> <p align=center style='text-align:center'><span style='font-size:9.0pt; font-family:Arial;color:black'><a href="http://chaos.uw.hu/c_dreamleir.php#fent#fent">Ugrás a lap tetejére</a></span><span style='font-size:9.0pt;font-family:Arial;color:#444444'><o:p></o:p></span></p> <p class=MsoNormal><o:p> </o:p></p> </div> </body> <br>Partneroldalak: <br> <a href="http://domain.domainshop.hu/domain.html" alt="tárhely domainregisztráció">Domain regisztráció tár és szerverszolgáltatások: domain domainnév tárhely e-mail, imap, pop3</a><br> <a href="http://www.webtar.hu" alt="tárhely donainregisztráció">www.webtar.hu</a><br> <a href="http://www.micropay.hu" alt="micropay">www.micropay.hu</a><br> <a href="http://www.ingyenweb.hu" alt="ingyenweb">www.ingyenweb.hu</a><br> <a href="http://www.videok.hu" alt="Videók">www.videok.hu</a><br> <a href="http://www.xn--antikvrium-x4a.hu" alt="Antikvárium">www.antikvárium.hu</a><br> <a href="http://www.ftpdir.hu" alt="ftpdir">www.ftpdir.hu</a><br> <a href="http://xn--fotk-sqa.hu" alt="fotók">www.fotók.hu</a><br> <a href="http://www.randi.hu" alt="Randi">www.randi.hu</a><br> <a href="http://www.licit.hu" alt="Licit">www.licit.hu</a><br> <a href="http://www.napivicc.hu" alt="vicc">www.napivicc.hu</a><br> <a href="http://www.gyertyalang.hu" alt="gyertyagyújtás">www.gyertyalang.hu</a><br> <a href="http://www.xn--helyesrs-fza2j.hu" alt="helyesírás.hu">www.helyesírás.hu</a><br> <a href="http://domain.webtar.hu/domain.html" alt="Domain regiszráció és tárhely">Domain regisztráció</a><br>