Projektowanie Stron WWW Studia Podyplomowe Grafika komputerowa i Techniki Multimedialne, 2013/2014, semestr II, dr inż. Robert Banasiak Projektowanie Stron WWW dr inż. Robert Banasiak Projektowanie stron WWW ELEMENTY INTERAKTYWNE NA STRONACH WWW Czas prezentacji: 45 minut
odsyłacze do stron wewnętrznych i zewnętrznych Interaktywność na stronach WWW odsyłacze do stron wewnętrznych i zewnętrznych obiekty dynamiczne (języki Skryptowe) zdarzenia dla urządzeń wskazujących Flash! animacje pliki wideo SD/HD dźwięk BINARNY/NUTY VRML / OpenGL stereo 3D
Odsyłacze do stron wewnętrznych i zewnętrznych Znaczniki odsyłaczy: <a>,</a> - nawiązuje połączenia pomiędzy elementami dokumentu <img>,</img> - wyświetla obraz graficzny <map>,</map> - definiuje odsyłacze na obrazkach <area>,</area> - definiuje obszar obrazka na, którym znajduje się odsyłacz
<a href="filmy/film2.html" target="_self"> Łącza do stron wewnętrznych i zewnętrznych <a href="filmy/film2.html" target="_self"> Parametr target określa nazwę okna (lub ramki), do którego będzie załadowany wskazany dokument. Jeżeli parametr występuje, to musi wystšpić razem z parametrem HREF. Jeżeli okno o podanej nazwie nie istnieje to zostanie ono otwarte. _blank - ładowanie do nowego, pustego okna _parent - ładowanie do okna poprzedniego (jeżeli istnieje) _self - ładowanie do bieżącego okna lub ramki _top - ładowanie do bieżącego okna
Łącza do stron wewnętrznych i zewnętrznych – mapy obrazów <img src="odsylacz.gif " usemap="#mapa1"> <map name ="mapa1"> <area shape=rect coords="1, 1, 50, 50" href="odsylacze/odsyl1.html"> <area shape=rect coords="51, 1, 100, 50" href="odsylacze/odsyl2.html"> <area shape=rect coords="1, 51, 51, 100" href="odsylacze/odsyl3.html"> <area shape=rect coords="51, 51, 100, 100" href="odsylacze/odsyl4.html"> </map>
Obiekty dynamiczne – JavaScript <script src=„plik_z_kodem_javascript.js" type="text/javascript"></script> <script type="text/javascript"> var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight: "SpryAssets/SpryMenuBarRightHover.gif"}); </script> <script src="http://www.licz.pl/counter.php?name=6712f9f3d1a9df702bca651e9e969aa0" type="text/javascript">
Pliki wideo – Internet Explorer! <OBJECT ID="MediaPlayer" WIDTH="100" HEIGHT="100" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject"> <PARAM NAME="FileName" VALUE=" plik_video"> <PARAM name="autostart" VALUE="true"> <PARAM name="ShowControls" VALUE="false"> <PARAM name="ShowStatusBar" value="false"> <PARAM name="ShowDisplay" VALUE="false"> <EMBED TYPE="application/x-mplayer2" SRC="plik_video.wmv" NAME="MediaPlayer" WIDTH="100" HEIGHT="100" ShowControls="1" ShowStatusBar="0" ShowDisplay="0" autostart="0"> </EMBED> </OBJECT>
Dźwięk BINARNY/NUTY – embed - – Internet Explorer! <embed hidden=true loop=true src=„plik.mid" type="application/x-mplayer2"> </embed> <embed hidden=true loop=true src=„plik.wav" type="application/x-mplayer2"> </embed>