1 / 13

1. Úvod

1. Úvod. Prečo som robil webstránku Začiatky, HTML JavaScript PHP. 2. Grafika. 3. HTML. 3.1. Horný panel. <table width="760" height="600"><tr><td colspan="2"> <-- horný panel (začiatok) --> <table><tr><td>< a href ="index.htm"> < img src ="../gif/logo.gif"></ a >

oihane
Download Presentation

1. Úvod

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 1. Úvod • Prečo som robil webstránku • Začiatky, HTML • JavaScript • PHP

  2. 2. Grafika

  3. 3. HTML 3.1. Horný panel <table width="760" height="600"><tr><td colspan="2"> <-- horný panel (začiatok) --> <table><tr><td><ahref="index.htm"> <img src="../gif/logo.gif"></a> </td><td><img src="../gif/logof.gif"> </td></tr></table></td></tr> <-- horný panel (koniec) -->

  4. 3. HTML 3.2. Ľavé menu <tr><td width="150" height="500"> <-- ľavé menu (začiatok) --> <table><tr><td><a href="index.htm"><img src="../gif/lbuvod.gif"></a></td> </tr><tr><td><a href="profil.htm"><img src="../gif/lbprofil.gif"></a></td></tr> <tr><td><a href="kontakt.htm"><img src="../gif/lbkontakt.gif"></a></td></tr> <tr><td><a href="produkty.htm"><img src="../gif/lbprodukty.gif"></a></td></tr> <tr><td><a href="eu.htm"><img src="../gif/lbeu.gif"></a></td></tr> <tr><td height="325" style="background-image: url('../gif/bgl.gif');"></td></tr></table></td> <-- ľavé menu (koniec) -->

  5. 3. HTML 3.3. Telo stránky <td width="610" height="500"> <-- telo stránky (začiatok) --> <table style="background-image:url('../gif/bc.gif');"> <tr><td> <-- telo stránky --> </td></tr></table> <-- telo stránky (koniec) --> </td></tr></table>

  6. 4. JavaScript HTML kód: <a href="index.htm"><img src="../gif/lbuvod.gif"> </a> Po začlenení JavaScriptu do HTML: <a href="index.htm„ onMouseOver="this.src='../gif/lbuvod_.gif';" onMouseOut="this.src='../gif/lbuvod.gif';"> <img src="../gif/lbuvod.gif"></a>

  7. 4. JavaScript Vyskytnutý problém Vyskytnutý problém • Dlhé načítavanie obrázkov Riešenie <script> lbuvod = new Image(); lbuvod.src = "gif/lbuvod_.gif"; </script> <a href="index.htm„ onMouseOver="this.src=lbuvod.src" onMouseOut="this.src='../gif/lbuvod.gif';"> <img src="../gif/lbuvod.gif"></a>

  8. 5. PHP 5.1. Horný panel <table width="760" height="600"><tr> <-- horný panel (začiatok) --> <td colspan="2"> <?include("web/hmenu.php");?></td></tr> <-- horný panel (koniec) -->

  9. 5. PHP 5.2. Ľavé menu <tr> <-- ľavé menu (začiatok) --> <td width style="background-image: url('gif/bgl.gif');"> <?include("web/lmenu.php");?></td> <-- ľavé menu (koniec) -->

  10. 5. PHP 5.3. Telo stránky <td width="610" height="500"> <-- telo stránky (začiatok) --> <table style="background-image:url('../gif/bc.gif');"> <tr><td> <?switch($x) { case"profil": include("web/profil.htm");break; case"kontakt": include("web/kontakt.htm");break; case"produkty": include("web/produkty.htm");break; case"eu": include("web/eu.htm");break; default: include("web/uvod.php");break; } ?> </td></tr></table> <-- telo stránky (koniec) --> </td></tr></table>

  11. 5. PHP JavaScript s HTML kódom: <a href="eu.htm" onMouseOver="this.src='../gif/lbeu_.gif'; " onMouseOut="this.src='../gif/lbeu.gif';"> <img src="../gif/lbeu.gif"></a> Po začlenení PHP: <a href="index.php?x=eu"> <img src="../gif/lbeu<?=($x=='eu')?'_':''?>.gif" onMouseOver="this.src=lbeu.src"<?=($x=='eu')?'': 'onMouseOut="this.src=\'../gif/lbeu.gif\';"'?>></a>

  12. 6. PHP v CSS <style type="text/css"> a.prof {text-decoration:<?=($x=='profil')? 'none':'underline'?>} a.spri {text-decoration:<?=($x=='sprievodca')? 'none':'underline'?>} a.spra {text-decoration:<?=($x=='spravy')? 'none':'underline'?>} a.hist {text-decoration:<?=($x=='historia')? 'none':'underline'?>} </style>

More Related