01.<html>
02.<head>
03.<title>ThaiCreate.Com jQuery Tutorials</title>
04.<style>
05. div.out { width:40%; height:120px; margin:0 15px;
06. background-color:#D6EDFC; float:left; }
07. div.in { width:60%; height:60%;
08. background-color:#FFCC00; margin:10px auto; }
09. p { line-height:1em; margin:0; padding:0; }
10.</style>
11.<script type="text/javascript" src="jquery-1.6.4.js"></script>
12.<script type="text/javascript">
13. $(document).ready(function(){
14.
15. var i = 0;
16. $("div.overout").mouseover(function() {
17. i += 1;
18. $(this).find("span").text( "mouse over x " + i );
19. }).mouseout(function(){
20. $(this).find("span").text("mouse out ");
21. });
22.
23. var n = 0;
24. $("div.enterleave").mouseenter(function() {
25. n += 1;
26. $(this).find("span").text( "mouse enter x " + n );
27. }).mouseleave(function() {
28. $(this).find("span").text("mouse leave");
29. });
30.
31. });
32.</script>
33.</head>
34.<body>
35.
36.<div class="out overout">
37. <span>move your mouse</span>
38. <div class="in">
39. </div>
40.</div>
41.
42.<div class="out enterleave">
43. <span>move your mouse</span>
44. <div class="in">
45. </div>
46.</div>
47.
48.</body>
49.</html>
ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน 
