by shigemk2

当面は技術的なことしか書かない

animate

jQuery

jQueryのanimateで自由にアニメーションできるようになろう | webOpixel
特定の要素に対しアニメーションを仕掛ける

まずはこれを覚えるべし。

$('セレクタ').animate({
  '動かすプロパティ': '目標地点の数値'
});

サンプル。

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
    <title>Hoge</title>
  </head>
  <body>
    <div id="box"></div>
  </body>
</html>
<script type="text/javascript">
$(function() {
    $('#box').animate({
	'marginLeft': '500px'
    });
});
</script><style>
 <!--
#box {
	width: 100px;
	height: 100px;
	background: #3399FF;
} -->
 </style>