Pokusavam da napravim neki jquery drop down meni, i skoro da mi je poslo za rukom, ali, avaj... IE8 se pobunio (meni radi fino u IE6, IE7, Chrome-u, Firefoxu i Operi).
Problem je sto IE8 'ne prepoznaje' slideDown() funkciju, odnosno pretpostavljam da su potrebne izvesne CSS/JQuery promene. Probao sam neke stvari, ali bez rezultata. (SlideUp, zacudo, radi).
Test je ovde:
http://www.sinisake.123bemyhost.com/menuJQ/
JQuery:
CSS, bitan deo:
Mislim da je problem u konfliktu poslednje 2 deklaracije - parent (ul) ima display:none, u startu, a detesce (li) display:block. doduse, to je problem samo za IE8.
Hvala!
Problem je sto IE8 'ne prepoznaje' slideDown() funkciju, odnosno pretpostavljam da su potrebne izvesne CSS/JQuery promene. Probao sam neke stvari, ali bez rezultata. (SlideUp, zacudo, radi).
Test je ovde:
http://www.sinisake.123bemyhost.com/menuJQ/
JQuery:
Code:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" >
$(document).ready(function(){
$("#navigation li").hover(
function () {
$(this).children('ul').css('left',$(this).position().left-41);
$(this).css('background-image','url(images/menu_hover.gif)');
$(this).children('ul').slideDown('normal');
},
function () {
$(this).css('background-image','url(images/menu.gif)');
$(this).children('ul').slideUp('slow');
}
);
});
</script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" >
$(document).ready(function(){
$("#navigation li").hover(
function () {
$(this).children('ul').css('left',$(this).position().left-41);
$(this).css('background-image','url(images/menu_hover.gif)');
$(this).children('ul').slideDown('normal');
},
function () {
$(this).css('background-image','url(images/menu.gif)');
$(this).children('ul').slideUp('slow');
}
);
});
</script>
CSS, bitan deo:
Code:
#navigation li {
display:inline;
padding:2px 5px 2px 10px;
margin:2px 1px 2px 0px;
background-image:url(images/menu.gif);
background-repeat:repeat-x;
}
.sub {
display:none;
position:absolute;
z-index:9999;
top:22px;
list-style:none;
}
#navigation li ul li{
display:block;
margin:0px;
}
#navigation li {
display:inline;
padding:2px 5px 2px 10px;
margin:2px 1px 2px 0px;
background-image:url(images/menu.gif);
background-repeat:repeat-x;
}
.sub {
display:none;
position:absolute;
z-index:9999;
top:22px;
list-style:none;
}
#navigation li ul li{
display:block;
margin:0px;
}
Mislim da je problem u konfliktu poslednje 2 deklaracije - parent (ul) ima display:none, u startu, a detesce (li) display:block. doduse, to je problem samo za IE8.
Hvala!
