01.
<html>
02.
<head>
03.
<title>ThaiCreate.Com jQuery Tutorials</title>
04.
<style>
05.
div {
06.
position: absolute;
07.
background-color:
#abc;
08.
left: 0px;
09.
top:30px;
10.
width: 60px;
11.
height: 60px;
12.
margin: 5px;
13.
}
14.
</style>
15.
<script type=
"text/javascript"
src=
"jquery-1.6.4.js"
></script>
16.
<script type=
"text/javascript"
>
17.
$(document).ready(
function
(){
18.
19.
20.
$(
"#go"
).click(
function
(){
21.
$(
".block"
).animate({left:
'+=100px'
}, 2000);
22.
});
23.
24.
25.
$(
"#stop"
).click(
function
(){
26.
$(
".block"
).stop();
27.
});
28.
29.
30.
$(
"#back"
).click(
function
(){
31.
$(
".block"
).animate({left:
'-=100px'
}, 2000);
32.
});
33.
34.
});
35.
</script>
36.
</head>
37.
<body>
38.
39.
<button id=
"go"
>Go</button>
40.
<button id=
"stop"
>STOP!</button>
41.
<button id=
"back"
>Back</button>
42.
<div class=
"block"
></div>
43.
44.
</body>
45.
</html>