Rolovacie horizontalne menu

ixod 0

Newbie

21. 12. 2007 #1

Zdravim vsetkych, urobil som si take menu, ktore funguje v Opere, Firefoxe ale nie v IE. Co mam zmenit v kode, aby to fungovalo. Prosim pomozte, dakujem.



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">

<meta http-equiv="Content-Language" content="sk">

<title>rolovacie menu</title>

<style type="text/css">

body {background: #eeeeee; color: #000000;}

/* behavior: url(csshover.htc); WinIE behavior call */

h1 {color: #aaaaaa; border-bottom: 1px solid; margin-bottom: 0;}

div#nav {float: left; margin: -1px 0 0 10em;

         background: #e0e0d0; border: 1px solid #000000; color:#000000;

         }

div#nav ul {margin: 0; padding: 0; background: white; color:#000000;

            border: 1px solid #CCC; border-width: 0 1px;

            }

div#nav li {position: relative; list-style: none; margin: 0;

            float: left; width: 10em; line-height: 1em;

            text-align:left;

            }

div#nav li:hover {background: #666666;}

div#nav li.submenu {background: url(dropmenu.gif) 95% 50% no-repeat;}

div#nav li.submenu:hover {background-color: #666666;}

div#nav li a {display: block; padding: 0.25em 0 0.25em 0.5em;

              text-decoration: none; width: 10em; color:#000000;

              }

div#nav li a:hover {display: block; padding: 0.25em 0 0.25em 0.5em;

              text-decoration: none; width: 10em; color:#FFFFFF;

              }

div#nav ul ul {position: absolute; width: 10em;

               display: none;

               }

div#nav ul ul li {border-bottom: 3px solid #CCC;}

div#nav ul.level2 {top: 1.5em; left: -1px;}



div#nav ul.level1 li.submenu:hover ul.level2 {display:block;}

</style>



</head>

<body>

<h1>nejaky nadpis</h1>



<div id="nav">

<ul class="level1">

 <li><a href="">Hlavná stránka</a>

 </li>



 <li class="submenu"><a href="">Oficialitky</a>

  <ul class="level2">

   <li><a href="">nieco1</a></li>

   <li><a href="">nieco2</a></li>

   <li><a href="">nieco3</a></li>

  </ul>

 </li>

 <li class="submenu"><a href="">Stiahnite si</a>

  <ul class="level2">

   <li><a href="">nieco1</a></li>

   <li class="submenu"><a href="">nieco2</a></li>

   <li><a href="">nieco3</a></li>

  </ul>

 </li>

 <li class="submenu"><a href="">Zaujímavosti</a>

  <ul class="level2">

   <li><a href="">nieco1</a></li>

   <li><a href="">nieco2</a></li>

   <li><a href="">nieco3</a></li>

  </ul>

 </li>

</ul>

</div>

 </body>

</html>

Nahlásit jako SPAM

IP: 78.98.233.–

Niekedy mám pocit, že čím viac sa vo veciach rýpem, tým menej im rozumiem.

Zelenáč 0

Posthunter

21. 12. 2007 #2

A co presne na tom nefunguje?

Nahlásit jako SPAM

IP: 89.176.254.–

Manq0

Věrný člen

22. 12. 2007 #3

Ani to fungovat nemůže. IE<6 nepodporuje pseudotřídu :hover na jiný prvek, nežli na <a>. Musíš si pomoci javascriptem.

Připravuji článek o víceúrovňovém menu. Musíš si ale počkat. Všechno tam vysvětluji, doufám, že pochopitelně a přehledně. Bude hotov do čtrnácti dnů.

Nahlásit jako SPAM

IP: 85.71.63.–

(x)HTML & CSS kodér webových stránek → http://manq.name

Gabo 0

Newbie

22. 12. 2007 #4

Presne tak ako píše Manq....IE6 a nižšie verzie podporujú pseudotriedu iba pri odkazoch <a href... .

Nahlásit jako SPAM

IP: 85.237.5.–

Nefaritus

~ Redaktor

Posthunter

Kultivátor příspěvků ve starém fóru – 3.66 % z celku

22. 12. 2007 #5

Já doufám, že IE6 co nejrychleji zmizí i když sem v tom asi dost optimistický :D

Nahlásit jako SPAM

IP: 213.191.111.–

Gabo 0

Newbie

22. 12. 2007 #6

To Nefaritus : no to dúfame aspon dvaja :D IE6 spôsobuje kopu problémov pri webdesigne :(

Nahlásit jako SPAM

IP: 85.237.18.–

ixod 0

Newbie

23. 12. 2007 #7

To Manq : IE 7 podporuje danu syntax? Alebo to musim poriesit cez javascript? V pripravovanom clanku najdem nejake info ako si s tym poradit aj bez JavaScriptu, alebo tam nieco taketo rozobrane nebude? To len ze ci sa mam pustit do JavaScriptu alebo cakat na clanok. Dik za odpovede.

Nahlásit jako SPAM

IP: 91.127.61.–

Niekedy mám pocit, že čím viac sa vo veciach rýpem, tým menej im rozumiem.

Manq0

Věrný člen

26. 12. 2007 #8

To ixod : IE7 pseudotřídu :hover bez problému podporuje i na prvky seznamu - v tvém případě prvek LI.

Bez JavaScriptu to jde také, ale řešení se mi zdá trochu krkolomné, takže v článku o tom nebude řeč. Stejně většina lidí má JS zapnutý permanentně. Ono řešení bez JS spočívá v podstrčení jiného kódu IE šestce. Konkrétně podstrčením tabulek.

Řešení bez JS je například zde http://www.cssplay.co.uk/menus/dd_valid_2.html

Nahlásit jako SPAM

IP: 85.71.63.–

(x)HTML & CSS kodér webových stránek → http://manq.name

Petroff0

Věrný člen

27. 12. 2007 #9

Chceš aby ti to fungovalo i v IE6 ?
1.Uprav si deklaraci body:
body { background: #eeeeee; color: #000000; behavior: url(csshover.htc) }

2. Do složky s xxx.html dej soubor csshover.htc který pokud nemáš tak ti ho posílám

To je vše.

Nahlásit jako SPAM

IP: 89.102.96.–

← Zpět na seznam vláken ← Zpět do Fóra