マージンを残してdivをアニメーション化できない

Question

マージンを残してdivをスクロールするタイマーを使用してアニメーションを作成したいのですが、自分のウェブサイトで試してみると適切なアニメーションができません即座に "マージン"を取得し、テストには何もしません。作業中のコードをコピー/ペーストするときにアニメーションを取得することさえできません。わかりません。ここに私のコードは次のとおりです。

HTML：

<div id="twitter"> 
    <img style="width:50px;height:50px;" src="mypicture"> 
    <img id="next_tweet" src="mypicture"> 
    <img id="next_tweet" src="mypicture"> 

</div> 
<script src="http://code.jquery.com/jquery-1.9.0rc1.js"></script> 

CSS：

#twitter { 
    width: 1000%; 
    padding: 95px 0 0 400px; 
    margin-left: 0px; 
    height: 220px; 
    -webkit-transition-delay: 2s; 
    /* Safari */ 
    transition-delay: 2s; 
} 

#next_tweet { 
    margin-left: 65px; 
    width: 50px; 
    height: 50px; 
} 

はJavaScript：

jQuery(document).ready(

    function(){ 
      jQuery('#twitter').animate({ 
       marginLeft : "-1060px" 
      },1000); 

}); 

https://jsfiddle.net/sqs7btcx/1/

[ちょうど私のdivは右に行くから欲しいですレフトン、すべての5 secondes、可能であれば]

誰かが私を助けることができるならば、感謝

Answer 1

まず、それが必要なので、あなたのコードはJSFiddle上で動作していませんでしたhttps外部ファイルへのリクエスト

第2に、あなたのアニメーション機能が正しく動作しない原因となっていたトランジション遅延がCSSにあります。

$(document).ready(function() { 
 
    $('#twitter').animate({ 
 
     marginLeft: "-=115px" 
 
    }, 5000); 
 
    });

#twitter { 
 
    width: 1000%; 
 
    padding: 95px 0 0 400px; 
 
    margin-left: 0px; 
 
    height: 220px; 
 
} 
 

 
#next_tweet { 
 
    margin-left: 65px; 
 
    width: 50px; 
 
    height: 50px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div id="twitter"> 
 
    <img style="width:50px;height:50px;" src="http://image.noelshack.com/fichiers/2015/10/1425504302-kancolle-9.png"> 
 
    <img id="next_tweet" src="http://image.noelshack.com/fichiers/2015/10/1425504302-kancolle-9.png"> 
 
    <img id="next_tweet" src="http://image.noelshack.com/fichiers/2015/10/1425504302-kancolle-9.png"> 
 
    <img id="next_tweet" src="http://image.noelshack.com/fichiers/2015/10/1425504302-kancolle-9.png"> 
 
    <img id="next_tweet" src="http://image.noelshack.com/fichiers/2015/10/1425504302-kancolle-9.png"> 
 
    <img id="next_tweet" src="http://image.noelshack.com/fichiers/2015/10/1425504302-kancolle-9.png"> 
 
</div>

Answer 2

利用JS libに：すべてのhttps://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script> 
jQuery(document).ready(

    function(){ 
      jQuery('#twitter').animate({ 
       marginLeft : "-1060px" 
      },1000); 

}); 
</script>