2015-06-11 63 views
1

此圖像是遊標trailimage的靜態div副本。一個是固定的,另一個是光標。我將如何編碼靜態div圖像跟隨光標?如何使圖像(div)在網站內的光標跟隨?

參考這個圖像http://deverexdrawer.deviantart.com/art/Trailimage-538913342

Trailimage JavaScript的摘錄

var trailimage=["images/contact/gardening-glove-cursor.png", , ] 
var offsetfrommouse=[-110,5] 
var displayduration=0 

if (document.getElementById || document.all) 
    document.write('<div id="trailimageid" style="position:absolute;visibility:visible;left:0px;top:100px;width:1px;height:1px"><img border="0" src="'+trailimage[0]+'"></div>') 

function followmouse(e){ 
    var xcoord=offsetfrommouse[0] 
    var ycoord=offsetfrommouse[1] 
    if (typeof e != "undefined"){ 
     xcoord+=e.pageX 
     ycoord+=e.pageY 
} 

</script> 

靜態的div圖像

...<img border="0" src="'+trailimage[0]+'" 
onmousedown="this.src=trailimage[1]" 
onmouseup="this.src=trailimage[0]" />... 

假設

var trailimage=[ 
    "images/contact/gardening-glove-cursor.png", 
    "images/contact/gardening-glove-cursor_down.png" ] 
+0

你去哪裏卡住了? – Newinjava

回答

1

試試這個

http://jsfiddle.net/n4foofvm/1/

HTML

<div id="movingDiv"> 
    <img id="barber" class="barber-image" src="1.jpg" /> 
</div> 

CSS

#movingDiv{ 
    width:20px; 
    height:20px; 
    position:absolute; 
} 

的JavaScript

$(document).mousemove(function(e){ 
    $("#movingDiv").css({left:e.pageX, top:e.pageY}); 
});