js rotation image timer

Question

このjsにタイマーを追加すると、「x」時間後にイメージが自動的に変更されます。変化が 'rel'属性を持つ 'a href'を介して行われますが、 'rel'を使用したその機能は依然として必要です。

JS：

$(document).ready(function(){ 
    $('#button a').click(function(){ 
     var integer = $(this).attr('rel'); 
     $('#myslide .cover').css({left:-1476*(parseInt(integer)-1)}).hide().fadeIn(); /*----- Width of div mystuff (here 160) ------ */ 
     $('#button a').each(function(){ 
     $(this).removeClass('active'); 
      if($(this).hasClass('button'+integer)){ 
       $(this).addClass('active')} 
     }); 
    }); 
}); 

は、HTML：

<div id="myslide"> 
<div class="cover"> 

    <div class="mystuff"> 
     <img src="images/header_01.jpg" rel="1"></img> 
     <img src="images/header_02.jpg" rel="1"></img> 
     <img src="images/header_03.jpg" rel="1"></img> 
    </div> 
</div> 

Answer 1

まあ、私は正確にあなたが何をしようとして見ることはできませんが、.delay()はあなたがしているもの、おそらくです探している。コードの実行を一時停止せずにjQueryのアニメーションキューを変更するので、アニメーションがまだ実行されていない間にイメージに関する他のものを変更できるはずです。

ローテーションの方法（.delay()で動作する方法）についてもお尋ねの場合は、jquery-animate-css-rotate-scaleをおすすめします。それを使用する方法の完全な手順については、Readmeファイルをチェックアウト、しかし、あなたが何をしたいのか、それはカップルのJavaScriptファイルを含めての問題になるだろうのために、と：遅延の

$('#image').delay(x).rotate(d); 

与えられたx秒をとd度。もちろん、もっと複雑なことをすることができます。

編集：

私はちょうどそれをアニメーション化するために、あなたが意図していない可能性があり実現。

$('#image').delay(x).queue(function() { 
    $('#image').css({transform: 'rotate(165deg)'}); 
}); 

これは、jQueryのアニメーションのようなCSSの変換を適用しますので、それを遅延させることができますが、実際には何もアニメーションなし：その場合は、あなたは、同じ著者の他のパッチは、jquery-css-transformはこのような何かをやっていることだけで使用する必要があります。

また、著者の個人用ウェブサイトには、jQueryを使用して6値変換マトリックスとして変換プロパティを返す場合に重要な注意があります。彼のパッチはこれを1.4.3より前の機能に戻し、代わりに変換文字列を返します（例えば、'rotate(90deg)'）。これは、アニメーション化されたソリューションとアニメーション化されていないソリューションの両方に適用されます。

編集2：

私はちょうどあなたが物理的に画像を回転させるが、ちょうど定期的に画像を切り替えたいかもしれないコメントを見ました。そのためには、上記の遅延の例を使用してください。代わりに、CSS変換の代わりに、あなたのイメージを置き換える内部関数を使用してください。この場合、jQueryプラグインと私が言及した制限を無視してください。