মাউস্-মূভ ইভেন্ট (Mousemove Event) : জে-কোয়েরী -(পর্ব-৩১)

যখন mouse pointer নড়ানো হয়, তখন mouse move event সংগঠি হয় (Occurs when mouse pointer moves)। যখন কোন element এর মধ্যে mouse move করে তখন ঐ element টির area এর মধ্যে প্রতি pixel এ mouse move event সংগঠিত হয়। যখন mouse কোন element কে trigger করে তখন mouse pointer এর track রাখার জন্য event.pageX (position of X axis) এবং event.pageY (position of Y axis) ব্যবহার করা যেতে পারে।

Example :
[sourcecode language=”html”]
<html>
<head>

<script src="http://code.jquery.com/jquery-latest.js"></script>

<style type="text/css">
#bigbigbox{
margin:16px 16px 16px 48px;
border:1px groove blue;
background-color : #BBBBBB;
width:300px;
height:200px;
}
#msg{
color:#800000;
}
</style>

</head>
<body>
<h1>jQuery mousemove example</h1>

<div id="bigbigbox"></div>

<p id="msg"></p>

<script type="text/javascript">

var i=0;
$(‘#bigbigbox’).mousemove(function(event) {
var msg = ‘mousemove() position – x : ‘ + event.pageX + ‘, y : ‘
+ event.pageY + ‘ [counter] : ‘ + i++;
$(‘#msg’).text(msg);
});

</script>
</body>
</html>
[/sourcecode]

Try Demo

………………………………………………………………………………
আলোকিত একটা সুন্দর সমৃদ্ধ পৃথিবী আমাদের প্রত্যেকেরই স্বপ্ন । আসুন আমাদের মেধা পরিশ্রম কে বিজ্ঞান সম্মতভাবে ব্যবহার করে, আমাদের স্বপ্ন পূরণে অংশ গ্রহণ করি। আজ এখানেই শেষ করলাম। “HAVE A GOOD PROGRAMMING”

জে-কোয়েরী ধারাবাহিক টিউটোরিয়ালঃ