Autor Zpráva
david78
Profil
Predovšetkým sa ospravedlňujem, ak to tu už bolo viackrát riešené. Zaujímalo by ma, ako zvyknete tento problém riešiť, akú stratégiu používate. Či je zvykom používať nejakú jQuery funkciu typu toggle, či rátate s jednoklikom + dvojklikom a hlavne s užívateľského hladiska, čo vám príde ako najvhodnejšie riešenie.
Konkrétne u mňa teraz potrebujem rozbaliť len jedno menu (z celkových 7) do troch podúrovní, z ktorých jedno má ešte svoje vlastné 3-4 podúrovne. Celková štruktúra obsahu proste takto vyšla. Nebyť tohoto, zaobídem sa na homepge bez akéhokoľvek javascriptu, čo by sa mi páčilo.
Celkom fajn by asi bolo nechať to na mobiloch rozbalené, ale to zas zaprasí dosť priestoru, takže by som potreboval radu skúsenejších.
CZghost
Profil
david78:
Zkusil jsem googlit, tam je odkaz na Responsiweb, kde se píše, že javascriptové řešení není příliš pohodlné. Domnívám se, že mobilní prohlížeče to mají ošetřené, takže odkaz neproklikne, dokud se menu neotevře. Případně to můžeš řešit událostí onclick, kde poprvé zakážeš prokliknutí, které umožní otevřít submenu bez přechodu na jinou stránku. Po otveření submenu se zákaz ruší a odkaz je normálně klikatelný. Takže asi takhle nějak (bude to potřebovat trochu úprav, nevím, zda to tak bude fungovat):
<ul class="menu">
  <li><a href="index.php">Domů</a></li>
  <li><a href="produkty.php" onclick="if(this.onclick==='return true') return false;">Produkty</a>
    <ul class="submenu">
      <li><a href="produkty/elektronika-a-spotrebice.php">Elektronika a elektrické spotřebiče</a></li>
      <li><a href="produkty/kamna-a-krby.php">Kamna a krby</a></li>
      <li><a href="produkty/stavebni-materialy.php">Stavební materiály</a></li>
    </ul>
  </li>
</ul>

To je příklad nějakého E-Shopu (nevím, proč si vybírám zrovna E-Shop, asi je mám nějak rád :D), CSS teď není důležitý, to se nastaví podle potřeby tak, aby položky seznamu utvořily položky menu...



Ještě jsem přidal živou ukázku, zkus se na to podívat na mobilu nebo v emulátoru (vývojářské nástroje: Opera - Ctrl+Shift+I, Chrome - F12).
Samotná živá ukázka: http://kod.djpw.cz/pocb-
Zdrojový kód: http://kod.djpw.cz/pocb

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0