Predmet:Tabovi
   
Primjer pravljenja tabova na stranici.
css mozete prebaciti u vas tekstualni fajl css.
PreuzmiIzvorni kôd (HTML):
- #tablist{ 
- padding: 3px 0; 
- margin-left: 0; 
- margin-bottom: 0; 
- margin-top: 0.1em; 
- font: bold 12px Verdana; 
- } 
-   
- #tablist li{ 
- list-style: none; 
- display: inline; 
- margin: 0; 
- } 
-   
- #tablist li a{ 
- text-decoration: none; 
- padding: 3px 0.5em; 
- margin-left: 3px; 
- border: 1px solid #778; 
- border-bottom: none; 
- background: white; 
- } 
-   
- #tablist li a:link, #tablist li a:visited{ 
- color: navy; 
- } 
-   
- #tablist li a:hover{ 
- color: #000000; 
- background: #C1C1FF; 
- border-color: #227; 
- } 
-   
- #tablist li a.current{ 
- background: lightyellow; 
- } 
-   
- <script type="text/javascript"> 
-   
- var selectedtablink="" 
- var tcischecked=false 
-   
- function handlelink(aobject){ 
- selectedtablink=aobject.href 
- tcischecked=(document.tabcontrol && document.tabcontrol.tabcheck.checked)? true : false 
- if (document.getElementById && !tcischecked){ 
- var tabobj=document.getElementById("tablist") 
- var tabobjlinks=tabobj.getElementsByTagName("A") 
- for (i=0; i<tabobjlinks.length; i++) 
- tabobjlinks[i].className="" 
- aobject.className="current" 
- document.getElementById("tabiframe").src=selectedtablink 
- return false 
- } 
- else 
- return true 
- } 
-   
- <li><a class="current" href="http://www.icentar.ba/showforum.php?id=41" onClick="return handlelink(this)">- Java skript </a></li>
 
- <li><a href="http://www.icentar.ba/showforum.php?id=37" onClick="return handlelink(this)">- C++ </a></li>
 
- <li><a href="http://www.icentar.ba/showforum.php?id=49" onClick="return handlelink(this)">- Access </a></li>
 
- <li><a href="http://www.icentar.ba/docs.php?id=4" onClick="return handlelink(this)">- Procitajte pravila </a></li>
 
- <iframe id="tabiframe" src="http://www.icentar.ba" width="98%" height="350px"></iframe> 
    
     Podrska samo putem foruma, jer samo tako i ostali imaju koristi od toga.