SoFunction
Updated on 2025-04-14

Mootools plugin implementation code that follows the background image and moves the mouse


<script style="text/javascript" src="/ajax/libs/mootools/1.4.1/"></script>
</head>
<body id='a'>
<h2 class='a'>Single images</h2>
<div id='bsfdimg' style='background:url("/upload/201112/") no-repeat scroll -50px -50px transparent;width:260px;height:200px;' w='392' h='600'></div>
<script type='text/javascript'>
var MoveBKimg=new Class({
initialize:function(){
this.$L=0;
this.$T=0;
},
Todo:function(i,opt){
={
bw: || 0, //Container width
bh: || 0,
iw: || 0, //image width
ih: || 0,
X: || 0, //The clientX coordinate of the mouse
Y: || 0
};o=;
if(!i || ! || ! || ! || !){return false;}
=; //The x-axis range where the image can actually be moved
=;
var P=('background-position');P=(" ");//Get the position value of the current background image and split it to Int type
P[0]=P[0].toInt();P[0]=(P[0].abs()>)?((P[0]<0)?-:):P[0];//The current X offset of the background image, and the value is corrected twice
P[1]=P[1].toInt();P[1]=(P[1].abs()>)?((P[1]<0)?-:):P[1];
(+'|'+);
if(>this.$L){//Move the mouse picture to the right and run to the left
this.$L=;
P[0]=(<(P[0]-10))?:(P[0]-10);
}
if(<this.$L){//Move the mouse picture to the left and run to the right
this.$L=;
P[0]=((P[0]+10)>0)?0:(P[0]+10);
}
if(>this.$T){//Move the mouse image down and run up
this.$T=;
P[1]=(<(P[1]-10))?:(P[1]-10);
}
if(<this.$T){//Move the mouse image up and run down
this.$T=;
P[1]=((P[1]+10)>0)?0:(P[1]+10);
}
('background-position',''+P[0]+'px '+P[1]+'px');//Add value to the background image's position again
}
});
El=$('bsfdimg');
var MoveBKimg=new MoveBKimg();
('mousemove',function(event){
(El,{bw:260,bh:200,iw:392,ih:600,X:,Y:});
})
</script>