logó WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS
Ingyenes elektronikus tananyag interaktív weboldalak készítéséhez.
vissza VISSZA    
menü MENÜ    
tovább TOVÁBB    

Webshop menü HTML kódjának bővítése



Az elrejtésre váró almenü előtt elhelyezünk egy kiválasztónégyzetet. Illesztünk hozzá egy label elemet is.

A későbbiekben kiválasztónégyzetet elrejtjük majd és csak a hozzá tartozó címke fog majd látszani.

1. példa:

Forráskód



....
 <div id="balmenu"> 
      <ul> 
...
        <li><a href="#">Termékek</a>
         <ul> 
           <li>
            <input id="valaszt1" name="valaszt" type="checkbox" checked>
            <label for="valaszt1">   </label>
            <a href="#">Kategória 1</a>
            <ul>
	      <li><a href="#">Alkat 1.1 </a></li>
	      <li><a href="#">Alkat 1.2 </a></li>
	      <li><a href="#">Alkat 1.3 </a></li>
	    </ul>
         </li>
         
... 
        <li><a href="#">Kategória N</a></li>     
       </ul>
    </li></ul><br>
  </div>
 ... 

Eredmény*


* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: webshop_hmenu_1a.html