0

一度に2つの見積もりを表示する見積もりローテーターを設定し、それぞれの間でスムーズに回転する必要があるときに、あちこちを飛び回っています。何が悪いのかわかりません。ここで実際の動作を確認してください-http://jsfiddle.net/RF3xK/1/

コードは以下のとおりです。

<div id="quotes">
<div class="textItem">
    testing the quotes testing the quotes
</div>
<div class="textItem">
    asdfdsaf sdf sdf sdf sf sd fsdaf sdf sdaf sdfsd f ds f dsf asdfsdafdsaf asdfdsaf sdf sdf sdf sf sd fsdaf sdf sdaf sdfsd f ds f dsf asdfsdafdsaf
</div>  
<div class="textItem">
    and another one
</div> 

およびjQuery

$(document).ready(function() {
$('#quotes .textItem').hide();
InOut($('#quotes .textItem:first'));

function InOut(elem) {
elem.delay().slideUp(800).delay(0).slideDown(0, function() {
    if (elem.next().length > 0) {
        InOut($(this).next());
    }
    else {
        InOut($(this).siblings(':first'));
    }
});
}

$('#quotes .textItem').mouseover(function() {
$(this).stop(true, true);
});
$('#quotes .textItem').mouseout(function() {
if ($(this).is(":visible") == true) {
    InOut($(this));
}
});
});
4

1 に答える 1

1

あなたが書いた方法でそれを修正する方法を見つけることができなかったので、ここに別のアプローチがあります:

http://jsfiddle.net/tFHWf/2/

var InOutInterval;
$(document).ready(function() {
    var textItems = $('.textItem'), 
        i = 0,
        setInOut = function(){        
            clearInterval(InOutInterval);
            InOutInterval = setInterval(function(){        
                textItems.eq(i%textItems.length).slideUp();
                textItems.eq((i+1)%textItems.length).slideDown();
                i++
            }, 800);        
        },
        pauseInOut = function(){
            clearInterval(InOutInterval);
        };
    textItems.eq(0).show();
    setInOut();    
    $('#quotes').hover(pauseInOut,setInOut);
});
于 2013-02-20T01:40:18.830 に答える