jQuery pokazujący się div

[benny]

Mam kolejny problem z jQuery.
Jestem bardzo początkujący, pierwsze kroki stawiam od tygodnia i znów napotkałem przeszkodzę.
Chcę, aby po najechaniu na jeden div, pokazywał się drugi. Po opuszczeniu tego pierwszego, ten drugi znikał. Kod mam następujący:

Kod:

$("div#offer-menu")
            .mouseover(function(){
                $("div.offer").slideDown("500");
            })
            .mouseout(function(){
                $("div.offer").slideUp("500");
            });

I wszystko działa ok, tylko nie w IE ;/
Może ktoś poratować?

[Kartofelek]

Kod:

$(document).ready(function() {

...tutaj twój kod

});

jak rozumiem masz powyższy fragment?
Jeżeli tak, to powinno śmigać.

[benny]

Tak mam ten kod, tylko przed tymi mouseover mam jeszcze kod slidera, w którym mi pomagałeś.. Wygląda to wszystko tak:

Kod:

<script>
    Cufon.replace('h1');
    
    $(document).ready(function() {
        var $sliders = $('.slider');
        $sliders.each(function() {
            var $current_slider = $(this);
            var $lista = $('.lista', $current_slider);
            var $li = $lista.children('li');
            if ($li.length > 3) {
                var odleglosc = $li.eq(0).outerWidth() + parseInt($li.eq(0).css('margin-left')) + parseInt($li.eq(0).css('margin-right'));
                var maxLeft = odleglosc * $li.length - 3 * odleglosc;
                $('.next', $current_slider).click(function() {
                    if ($lista.position().left > -maxLeft) {
                        $($lista).not(':animated').animate({
                            'left' : '-='+odleglosc
                        },500);
                    }
                    else {
                        $($lista).not(':animated').animate({
                            'left' : 0
                        },500);
                    }
                });
                $('.prev', $current_slider).click(function() {
                    if ($lista.position().left<0) {
                        $($lista).not(':animated').animate({
                            'left' : '+='+odleglosc
                        },500);
                    }
                    else if ($lista.position().left==0) {
                         $($lista).not(':animated').animate({
                            'left' : '-='+odleglosc
                        },500);
                    }
                });
            } else {
                $('.next, .prev', $current_slider).click(function() {
                    $(this).preventDefault();
                    return false;
                });
            }
        })
        
        var offer_menu = $("div#offer-menu");
        var offer = $("div.offer");
        
        $(offer_menu).mouseenter(function(){
            $(offer).slideDown("500");
            $(offer).mouseenter(function(){
                
            })
            $(offer).mouseleave(function leave(){
                $(offer).slideUp("500");
            })
        });
        
    });    
    </script>

Przerobiłem to na mouseenter i mouseleave żeby sprawdzić czy tutaj jest błąd, ale dalej nie działa w IE, a w FF, Operze i Chrome śmiga jak trzeba.

[Kartofelek]

Kod:

var offer_menu = $("div#offer-menu");
        var offer = $("div.offer");
        
        $(offer_menu).
.....

przeczytaj za karę ten fragment kodu 100 razy

[benny]

Kara dosyć sroga, szkoda, że nie ma uzasadnienia do tej kary bo samo czytanie tego samego 100 razy chyba nic nie da, jeśli nie wie się o co chodzi ;p
Jeśli chodzi o to, że dałem to sobie do zmiennych to nie wiem co to ma wspólnego?
Chcę tego używać później więc głupio by było pisać za każdym razem div#cośtam
Innym moim pomysłem na błąd jest brak '' w offer_menu, ale działa z i bez tego na FF, Chrome, Operze a z i bez tego nie działa w IE.
Więc może jakieś naprowadzenie?

[Kartofelek]

Logika, logika:
Skoro (wedle twojego przykładu):

Kod:

var offer_menu = $("div#offer-menu");

to

Kod:

$(offer_menu).

jest tym samym co

Kod:

$($("div#offer-menu"))

czyli źle.
Powinno być:

Kod:

var offer_menu = $("div#offer-menu");
        var offer = $("div.offer");
        
       offer_menu.mouseenter(function(){...bla bla bla

a najlepiej dawaj $ przed zmiennymi zawierającymi pobrane przez jquery obiekty. Ulatwi ci to obeznanie.

Kod:

var $offer_menu = $("div#offer-menu");
        var $offer = $("div.offer");
        
       $offer_menu.mouseenter(function(){...bla bla bla

A teraz wróć do wcześniej zadanej lektury :}

[benny]

Zmieniłem..

Kod:

offer_menu.mouseenter(function(){
            offer.slideDown("500");
            offer.mouseleave(function(){
                offer.slideUp("500");
            });
        });

Dalej w IE nei działa..
Dorzucam dla chętnych udzielenia mi pomocy, styl tego co ma się pojawiać. Może tutaj tkwi problem?

Kod:

div.offer {
    display: none;
    position: absolute;
    top: 120px;
    margin-left: 112px;
    font-family: Arial;
    font-size: 11px;
    line-height: 20px;
    padding: 10px 0 0 20px;
    background: url(../images/offer-tree.png) no-repeat;
}

EDIT:
Dodałem offer.css("display", "block") i działa Dzięki za naprowadzenie!