jQuery 画像が左か右に無限ループする script プラグイン無し

動きはこんな感じです

to 看護

 

jQueryCDNは、

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

です。

ーーー

html部分

 

<div id="contactWrap">
   
  </div>

css

実際の動きはこちらで確認できます。

http://tokotoko6667777.hippy.jp/to-sample-web/index.html

 

backgroundで画像指定

ーーー

<script>

// 移動
  $(document).ready(function(){
  $('#contactWrap').css("background-position","0% bottom");
  var speed = 0.07;
  var posX = 6000;
   
  setInterval(function(){
  if(posX <= -1){posX = 0;}
  posX -= speed;
  $('#contactWrap').css("background-position",posX + "px bottom");
  }, 5);
  });

</script>

 

posXの値を変えれば、動きの左右を変えれます。

speedで動きの速度を変えれます。