1 (edited by Min2liz 2012-07-12 11:28:15)

Topic: Chrome + jQuery Bug

Yra HTML:

<div id="slide-runner">
     <a href="" id="slideimage-1" class="slideimagecontainer" style=""><img id="slide-img-1" src="storage/sliders/Penguins.jpg" class="slide" alt=""></a>
     <a href="" id="slideimage-2" class="slideimagecontainer" style=""><img id="slide-img-2" src="storage/sliders/Tulips.jpg" class="slide" alt=""></a>
     <a href="" id="slideimage-3" class="slideimagecontainer" style=""><img id="slide-img-3" src="storage/sliders/Koala.jpg" class="slide" alt=""></a>
     <a href="" id="slideimage-4" class="slideimagecontainer" style=""><img id="slide-img-4" src="storage/sliders/Jellyfish.jpg" class="slide" alt=""></a>
     <a href="" id="slideimage-5" class="slideimagecontainer" style=""><img id="slide-img-5" src="storage/sliders/Desert.jpg" class="slide" alt=""></a>
</div>

JavaScript:

function gotoSlide(slideNum){
       if (slideNum != prevSlide){
            // Show current slide
            $('#slide-'+slideNum).addClass('featureactive');
            $("#slideimage-"+slideNum).fadeIn(FADE_SPEED);
            $("#slideimage-"+prevSlide).fadeOut(FADE_SPEED);
            $('#slide-'+prevSlide).removeClass('featureactive');
            prevSlide = currentSlide;
            if (interval != null){
                clearInterval(interval);
            }
            interval = setInterval(nextSlide, DELAY_SPEED);
        }
}

Viskas kaip ir veikia taip kaip turi veikti. Tik žinoma negali to būti :) Chrome mistiniu būdu neuždeda display: none; ant <a>.
jQuery fadeOut, po animacijos automatiškai uždeda display: none;, visur veikia, išskyrus Chrome. FireFox/Opera/IE() veikia kaip nurodyta, o Chrome kažko spyriojasi, gal yra numanačių/žinančių kodėl būtent Chrome nepatinka fadeOut ir nededa display: none ?

Edit:

http://bugs.jquery.com/ticket/7978

Re: Chrome + jQuery Bug

http://bugs.jquery.com/ticket/7978#comment:9 nepadėjo (ar kiti sprendimai is webkit bug trackeriu)?

Gal tiesiog rankiniu būdu paslėpus išsispręstų?

<..>.fadeIn(FADE_SPEED, function() {$(this).css('display': 'block')});

Re: Chrome + jQuery Bug

Bugas yra tik su <a>, perdarius ant <div viskas veikia idealiai.

HTML:

<div id="slide-runner">
        <div class="slideimagecontainer" id="slideimage-1" style="width: 1000px; height: 315px; position: absolute; display: block; "><a href=""><img id="slide-img-1" src="storage/sliders/Penguins.jpg" class="slide" alt=""></a></div>
        <div class="slideimagecontainer" id="slideimage-2" style="width: 1000px; height: 315px; position: absolute; display: none; "><a href=""><img id="slide-img-2" src="storage/sliders/Koala.jpg" class="slide" alt=""></a></div>
        <div class="slideimagecontainer" id="slideimage-3" style="width: 1000px; height: 315px; position: absolute; display: none; "><a href=""><img id="slide-img-3" src="storage/sliders/Jellyfish.jpg" class="slide" alt=""></a></div>
        <div class="slideimagecontainer" id="slideimage-4" style="width: 1000px; height: 315px; position: absolute; display: none; "><a href=""><img id="slide-img-4" src="storage/sliders/Desert.jpg" class="slide" alt=""></a></div>
        <div class="slideimagecontainer" id="slideimage-5" style="width: 1000px; height: 315px; position: absolute; display: none; "><a href=""><img id="slide-img-5" src="storage/sliders/Tulips1.jpg" class="slide" alt=""></a></div>
</div>

JS:

function gotoSlide(slideNum){
       if (slideNum != prevSlide){
            // Show current slide
            $('#slide-'+slideNum).addClass('featureactive');
            $("#slideimage-"+prevSlide).fadeOut(FADE_SPEED);
            $("#slideimage-"+slideNum).fadeIn(FADE_SPEED);
            $('#slide-'+prevSlide).removeClass('featureactive');
            prevSlide = currentSlide;
            if (interval != null){
                clearInterval(interval);
            }
            interval = setInterval(nextSlide, DELAY_SPEED);
        }
    }