মাউস-মূভ ইভেন্ট (Mousemove Event)

মাউস্-মূভ ইভেন্ট (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 :

<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>

Demo :



<< Previous Next >>


লেখকঃ ঢাকা প্রকৌশল ও প্রযুক্তি বিশ্ববিদ্যায়ের(DUET) কম্পিউটার সায়েন্স এ্যান্ড ইঞ্জিনিয়ারিং(CSE) বিভাগের ৪র্থ বর্ষের এক জন ছাত্র। তিনি ওয়েব ডিজাইন, ওয়েব ডেভলপমেন্ট এর বিভিন্ন বিষয় যেমন : এইচটিএমএল, সিএসএস, জাভাস্ক্রিপ্ট, জে কোয়েরি, পিএইচপি, .Net ইত্যাদি বিষয়ের উপর অভিজ্ঞ। তিনি ACM ICPC সহ বিভিন্ন আন্তর্জাতিক প্রোগ্রামিং প্রতিযোগীতায় অংশগ্রহন করেছেন। তাকে ফেসবুকে অনুসরন করতে এখানে ক্লিক করুন।

কপি রাইট © ২০১১-২০১২ সর্বস্বত্ত্ব সংরক্ষিত, টিউটরিয়ালবিডি, একটি টিউটো ওয়েবস প্রতিষ্ঠান.