开发者

changing cursos image with jquery on mouse over a div

I need to know how to change the cursor image on mouse over a 100% width div depending on x values. I'm using a plugin to move the div content on mouse move and I need to change the cursor image to indicate that user interface solution. I resume : The cursor image must change to left arrow image when the mouse be over the left side of the div. The cursor must change to right image arrow when be on the right side of the div, but remember the div container is 100% width. THANKS A LO开发者_如何学JAVAT IN ADVANCE GUYS!!!


Here's a quick solution You could use different cursors but you get the picture.

http://jsfiddle.net/capo64/J4hvZ/

Edit: Here's the jQuery just for reference

$('.MyDiv').mousemove(function(e) {
    var $this = $(this);
    var width = $this.width();
    var x = e.pageX - this.offsetLeft;

    if (x / width <= .5){
        $this.css('cursor', 'w-resize');
    } else {
        $this.css('cursor', 'e-resize');
    }
});


try this... once you know where the cursor is you can change the cursor icon.

var leftMin=0;
var leftMax=xxx;
var rightMin=yyy;
var rightMax=zzz;
$('div'.mousemove(function(e){

if(e.pageX> leftMin && e.pageX<leftMax){
// the user is in the left side of the panel.
}

if(e.pageX> rightMin && e.pageX<rightMax){
// the user is in the right side of the panel.
}

});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜