problém s výsuvným menu
Mám problém s menu.
Mám hlavní menu a po najetí na jednotlivé položky se otevře submenu. To vše funguje bez problému až na jeho zavření, které jsem se pokoušel řešit:
a) přidáním atributu onmouseover pro celý blok sub menu - při pokusu najet na druhou položku submenu se menu zavře
<div id="menu">
<div id="m1" class="bmenu" onmouseover="hide(); show(1); msell(1)" ><big>Menu1</big></div>
<div id="m2"class="bmenu" onmouseover="hide(); show(2); msell(2)" ><big>Menu2</big></div>
<div id="m3"class="bmenu" onmouseover="hide(); msell(3)" onmouseout="musell()"><big>Menu3</big></div>
<div id="m4"class="bmenu" onmouseover="hide(); msell(4)" onmouseout="musell()"><big>Menu4</big></div>
<div id="m5"class="bmenu" onmouseover="hide(); msell(5)" onmouseout="musell()"><big>Menu5</big></div>
<div id="m6"class="bmenu" onmouseover="hide(); msell(6)" onmouseout="musell()"><big>Menu6</big></div>
<div id="m7"class="bmenu" onmouseover="hide(); msell(7)" onmouseout="musell()"><big>Menu7</big></div>
<div id="m8"class="bmenu" onmouseover="hide(); msell(8)" onmouseout="musell()"><big>Menu8</big></div>
<small>
<div id="menu1" class="blok" style="top: 0px;"onmouseout="hide()">
<div id="s1" class="submenu" onmouseover="tabsell(1)" onmouseout="untabsell(1)">Polozka1</div>
<div id="s2" class="submenu" onmouseover="tabsell(2)" onmouseout="untabsell(2)">Polozka2</div>
<div id="s3" class="submenu" onmouseover="tabsell(3)" onmouseout="untabsell(3)">Polozka3</div>
<div id="s4" class="submenu" onmouseover="tabsell(4)" onmouseout="untabsell(4)">Polozka4</div>
<div id="s5" class="submenu" onmouseover="tabsell(5)" onmouseout="untabsell(5)">Polozka5</div>
<div id="s6" class="submenu" onmouseover="tabsell(6)" onmouseout="untabsell(6)">Polozka6</div>
</div>
b) přidáním atributu onmouseover pro vedlejší <div id="main" onmouseover="hide()"> funguje pouze v exploreru ne ve firefoxu
už si nevím rady, prosím o pomoc, předem děkuji za odpovědi
Mám hlavní menu a po najetí na jednotlivé položky se otevře submenu. To vše funguje bez problému až na jeho zavření, které jsem se pokoušel řešit:
a) přidáním atributu onmouseover pro celý blok sub menu - při pokusu najet na druhou položku submenu se menu zavře
<div id="menu">
<div id="m1" class="bmenu" onmouseover="hide(); show(1); msell(1)" ><big>Menu1</big></div>
<div id="m2"class="bmenu" onmouseover="hide(); show(2); msell(2)" ><big>Menu2</big></div>
<div id="m3"class="bmenu" onmouseover="hide(); msell(3)" onmouseout="musell()"><big>Menu3</big></div>
<div id="m4"class="bmenu" onmouseover="hide(); msell(4)" onmouseout="musell()"><big>Menu4</big></div>
<div id="m5"class="bmenu" onmouseover="hide(); msell(5)" onmouseout="musell()"><big>Menu5</big></div>
<div id="m6"class="bmenu" onmouseover="hide(); msell(6)" onmouseout="musell()"><big>Menu6</big></div>
<div id="m7"class="bmenu" onmouseover="hide(); msell(7)" onmouseout="musell()"><big>Menu7</big></div>
<div id="m8"class="bmenu" onmouseover="hide(); msell(8)" onmouseout="musell()"><big>Menu8</big></div>
<small>
<div id="menu1" class="blok" style="top: 0px;"onmouseout="hide()">
<div id="s1" class="submenu" onmouseover="tabsell(1)" onmouseout="untabsell(1)">Polozka1</div>
<div id="s2" class="submenu" onmouseover="tabsell(2)" onmouseout="untabsell(2)">Polozka2</div>
<div id="s3" class="submenu" onmouseover="tabsell(3)" onmouseout="untabsell(3)">Polozka3</div>
<div id="s4" class="submenu" onmouseover="tabsell(4)" onmouseout="untabsell(4)">Polozka4</div>
<div id="s5" class="submenu" onmouseover="tabsell(5)" onmouseout="untabsell(5)">Polozka5</div>
<div id="s6" class="submenu" onmouseover="tabsell(6)" onmouseout="untabsell(6)">Polozka6</div>
</div>
b) přidáním atributu onmouseover pro vedlejší <div id="main" onmouseover="hide()"> funguje pouze v exploreru ne ve firefoxu
už si nevím rady, prosím o pomoc, předem děkuji za odpovědi
<HTML>Lze udělat vysouvací/roletové menu čistě pomocí CSS. Snad každý cool webík o CSS se o tom zmiňuje, např. <a href="http://www.tvorba-webu.cz/css/vysouvaci-menu.php">
http://www.tvorba-webu.cz/css/vysouvaci-menu.php</a>
Pokud trváte na použití JS, doporučuju univerzální řešení, které by Vás mohlo zbavit potíží s různými prohlížeči - <a href="http://jquery.com/">jQuery</a>. Jen se připravte, že budete tak dva až tři dny zkoumat tutoriály a návody.</HTML>
http://www.tvorba-webu.cz/css/vysouvaci-menu.php</a>
Pokud trváte na použití JS, doporučuju univerzální řešení, které by Vás mohlo zbavit potíží s různými prohlížeči - <a href="http://jquery.com/">jQuery</a>. Jen se připravte, že budete tak dva až tři dny zkoumat tutoriály a návody.</HTML>
Pokud nepotřebuješ nějaké speciální efekty (jako třeba postupné rozbalování výsuvné nabídka, viz můj web, pro který jsem to kdysi programoval asi půl dne), tak rozhodně jdi do řešení pomocí hover CSS.
Michodem to zde odkazované řešení na hover CSS menu nefunguje v IE. Předpokládám, že je to tím, že v úkazce není definován doctype.
Michodem to zde odkazované řešení na hover CSS menu nefunguje v IE. Předpokládám, že je to tím, že v úkazce není definován doctype.
Řešení je pro tenhle problém v javascriptu je relativně jednoduché. Zavedeš si bool proměnnou, která bude značit otevření jakékokoliv menu (true) a zavření všech (false). Potom na samotné vysunované objekty přidáš událost onmouseout na zavření. Je to na delší povídání, základ jsem snad popsal dostatečně.
Mimo to máš své menu řazené dost podivně, a stejně tak je podivné, že máš javascriptové události na všech položkách submenu. Být tebou, začnu znova při klasickém uspořádání ve stylu:
<ul>
<li><a href="#">Prvni</a></li>
<li>
<a href="#">Druhe</a>
<ul>
<li><a href="#">Sub Druhe, Prvni</a></li>
<li><a href="#">Sub Druhe, Druhe</a></li>
</ul>
</li>
<li><a href="#">Treti</a></li>
</ul>
Pavero: Zmíněné menu nefunguje v IE protože chybí pomocný prvek: li{behavior:url('hover.htc');} Soubor hover.htc lze stáhnout z několika umístění, to už stačí pohledat.
Mimo to máš své menu řazené dost podivně, a stejně tak je podivné, že máš javascriptové události na všech položkách submenu. Být tebou, začnu znova při klasickém uspořádání ve stylu:
<ul>
<li><a href="#">Prvni</a></li>
<li>
<a href="#">Druhe</a>
<ul>
<li><a href="#">Sub Druhe, Prvni</a></li>
<li><a href="#">Sub Druhe, Druhe</a></li>
</ul>
</li>
<li><a href="#">Treti</a></li>
</ul>
Pavero: Zmíněné menu nefunguje v IE protože chybí pomocný prvek: li{behavior:url('hover.htc');} Soubor hover.htc lze stáhnout z několika umístění, to už stačí pohledat.
to Freeze: No ten hover.htc je dnes už potřeba jen pro IE6 a starší. V IE7&8 stačí nastavit doctype XHTML 1.0 Transitional nebo Strict a bude to taky šlapat.
Pavero: Jasně, to vím. Když jsi však reagoval, že to v IE nefunguje, myslel jsem, že narážíš na IE6 ;)
Kdepak, IE6 už jako vývojář vesměs dávno ignoruji :). Což na jednu stranu není možná dobře, ale člověk si tím ušetří spoustu nervů :). A navíc, to ignorování musí přijít ze strany vývojářů, dokud ti budou používat šílený 'hacky', aby se stránky v IE6 zobrazovaly korektně, pak uživatele nic nemotivuje k upgradu. Naštěstí už pár velkých hráčů tohle pochopilo, třeba YouTube a na podporu IE6 již kašlou.
Smutným faktem ale je, že v dnešní době procentuální zastoupení IE6 v ČR stále dělá 15%.
Smutným faktem ale je, že v dnešní době procentuální zastoupení IE6 v ČR stále dělá 15%.
Pavero: Ignorovat IE6 ze strany vývojářů není zase tak snadné. Tady nejde o nás, ale o zákazníky. Youtube a jiní velci hráči si toto mohou dovolit. Pro ně je to přijatelné riziko. Ale firma, která dělá zakázky pro klienta, si toto nemůže dovolit. Klient nepochopí, že IE6 je šmejd. Pro ně je důležitá funkčnost. A pokud pro ně web nebude fungovat, tak může zakázku reklamovat nebo od toho odstoupit a firma prodělá. A to jen kvůli tomu, že používají IE6.
Smutným faktem je, že firmy nemají ochotu upgradovat IE. Vedení nezajímá co je IE6 a že je špatné. Pro ně je důležité, že to funguje a že nemusí nic platit. Proč utrácet peníze nebo drahocenný čas, když to funguje. Což je taky důvod, proč vzniká bariera mezi manažéry a ajťáky.
Smutným faktem je, že firmy nemají ochotu upgradovat IE. Vedení nezajímá co je IE6 a že je špatné. Pro ně je důležité, že to funguje a že nemusí nic platit. Proč utrácet peníze nebo drahocenný čas, když to funguje. Což je taky důvod, proč vzniká bariera mezi manažéry a ajťáky.
Tomík, Pavero: Právě proto je jenom dobře, že YouTube (z větších myslim, že i Facebook a MySpace) ignorují IE6 a zobrazují hlášku s doporučením upgrade na novější prohlížeč. Jestli totiž něco donutí lenochy k upgrade, tak to bude jen nefunkčnost zaběhnutých a používaných webů. A z hlediska klientů má Tomík bohužel pravdu - naštěstí při použítí nejběžnějších součástí css, tak se lze s hackem většinou omezit na přidání dvou, tří řádků "pouze pro IE<7".
Ale asi jsme trochu odbočili od tématu, snad to Nípal nesmaže :)
Tak ať to shrnu.. ukázku z http://www.tvorba-webu.cz/css/vysouvaci-menu.php je třeba upravit:
1) Přidat doctype
2) Pro IE6 přidat soubor hover.htc a do stylu li{behavior:url('hover.htc');}
Ale asi jsme trochu odbočili od tématu, snad to Nípal nesmaže :)
Tak ať to shrnu.. ukázku z http://www.tvorba-webu.cz/css/vysouvaci-menu.php je třeba upravit:
1) Přidat doctype
2) Pro IE6 přidat soubor hover.htc a do stylu li{behavior:url('hover.htc');}
jj, souhlásím, náš zákazník je holt náš pán :). Pak už záleží na konkrétní situaci, pokud se u zákazníka chci teprve "zaháčkovat", tak mu musím splnit, co mu na očích uvidím, pokud už jsem pro něj významnějším dodavatelem nějaké technologie nebo SW, pak už si mohu začít i trochu vyskakovat :).
Nícméně firmy jsou tím hlavním viníkem, proč IE6 má stále takový podíl. Na jejich obranu by ještě mělo zaznít, že to nemusí být jen ignorance ze strany manažerů, ale i prostý fakt, že řada jejich intranetových aplikací běží korektně pouze pod IE6. Což je ale pro ně výhledově cesta do pekel.
Abychom se ale vrátili k tématu. Ten hover.htc, zapouzdřuje, pokud se nepletu, javascriptovou podporu onmouse událostí, ne? Takže tím pádem už nikdy nemáme čisté CSS řešení ;-).
Nícméně firmy jsou tím hlavním viníkem, proč IE6 má stále takový podíl. Na jejich obranu by ještě mělo zaznít, že to nemusí být jen ignorance ze strany manažerů, ale i prostý fakt, že řada jejich intranetových aplikací běží korektně pouze pod IE6. Což je ale pro ně výhledově cesta do pekel.
Abychom se ale vrátili k tématu. Ten hover.htc, zapouzdřuje, pokud se nepletu, javascriptovou podporu onmouse událostí, ne? Takže tím pádem už nikdy nemáme čisté CSS řešení ;-).
<HTML>Ano, ale na druhou stranu, je funkční a jednoduché. A pořád ta tíha hover stylů je na straně CSS, hover.htc jen upravuje chování IE při onmouse události a dovoluje mu použít hover styl i u neodkazů.</HTML>
Nové příspěvky
index.html )
HTML Tabulky
Zalamování textu pomocí CSS
Přesměrování
Arduino - 400 Bad Request
Nastavení českých písmen
POMOC! po druhé!
Pozicování (obrázek na střed).
Jak vycentrovat obrazek, ktery je v prikazu absolute ?
Použití tvůrce webu
katalog
async functions' is only available in es8 (use 'esversion: 8')
Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0
Problém s načítáním
Div pro reklamu překrývá prvky webové stránky
Nezobrazuje se mi lišta s reklamou
ako nahrám na môj web favicon?
JavaScript - nečitelný soubor *.js - jak prohlížet/editovat
Problém s textem
videostream
index.html
GB///refresh///JS
Total Commander - server nenalezen
Mobilní verze webu
Sloučené "hledání"
Další témata
STATUS
FTP
HTTP
SQL
PHP
© 2002 - 2024 Web zdarma s.r.o. — zvládnete to sami