\r
<style type="text/css">\r
\r
-html, body { height: 100%; }\r
+html, body { height: 95%; }\r
#main { height: 100%; }\r
-#drag { width: 200px; height: 200px; background: #eef; }\r
+#drag { cursor: move; width: 200px; height: 200px; background: #eef; }\r
\r
</style>\r
\r
var left = center.x;\r
var top = center.y;\r
\r
- var fakemouse = $('<img src="images/cursor.png" id="fakemouse"/>');\r
- var realmouse = $('<img src="images/cursor.png" id="realmouse"/>');\r
+ var OS = (/(win|mac|linux)/i.exec(navigator.platform) || ['other'])[0].toLowerCase();\r
+\r
+ var defaultUrl = ['cursors', OS == 'other' ? 'win' : OS, 'default.png'].join('/');\r
+ var cursorUrl = function() {\r
+ return ['cursors', OS == 'other' ? 'win' : OS, $(el).css('cursor') + '.png'].join('/');\r
+ }\r
+ var noneUrl = ['cursors', OS == 'other' ? 'win' : OS, 'none.cur'].join('/');\r
+\r
+ var fakemouse = $('<img src="' + defaultUrl + '" id="fakemouse" />');\r
+ var realmouse = $('<img src="' + defaultUrl + '" id="realmouse" />');\r
if ($.browser.msie && $.browser.version == 6) {\r
- fakemouse = $('<div id="fakemouse" style="height:23;width:16;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/cursor.png\', sizingMethod=\'scale\');" ></div>');\r
- realmouse = $('<div><div id="realmouse" style="height:23;width:16;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/cursor.png\', sizingMethod=\'scale\');" ></div></div>');\r
+ fakemouse = $('<div id="fakemouse" style="height:32;width:32;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + defaultUrl + '\', sizingMethod=\'scale\');" ></div>');\r
+ realmouse = $('<div><div id="realmouse" style="height:32;width:32;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + defaultUrl + '\', sizingMethod=\'scale\');" ></div></div>');\r
}\r
var mousescreen = $('<div id="mousescreen"/>');\r
+\r
+ var updateCursor = function() {\r
+ if ($.browser.msie && $.browser.version == 6) {\r
+ fakemouse.css('filter', 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + cursorUrl() + '\', sizingMethod=\'scale\'');\r
+ } else {\r
+ fakemouse.attr('src', cursorUrl());\r
+ }\r
+ }\r
+ var resetCursor = function() {\r
+ if ($.browser.msie && $.browser.version == 6) {\r
+ fakemouse.css('filter', 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + defaultUrl + '\', sizingMethod=\'scale\'');\r
+ } else {\r
+ fakemouse.attr('src', defaultUrl);\r
+ }\r
+ }\r
\r
var testStart = function() {\r
+ $(el).bind("mouseover", updateCursor).bind("mouseout", resetCursor);\r
fakemouse.appendTo('body').css({ position: 'absolute', left: mouseX, top: mouseY, zIndex: 5000 });\r
- realmouse.appendTo('body').css({ position: 'absolute', left: mouseX, top: mouseY, zIndex: 5000, opacity: 0.1 })\r
- .mousedown(function() { return false; });\r
+ realmouse.appendTo('body').css({ position: 'absolute', left: mouseX, top: mouseY, zIndex: 5000, opacity: 0.1 });\r
mousescreen.appendTo('body').css({ width: '100%', height: '100%', position: 'absolute', top: 0, left: 0, zIndex: 5000 })\r
.mousemove(function(e) { realmouse.css({ left: e.pageX, top: e.pageY }); return false; })\r
.mousedown(function() { return false; })\r
.mouseup(function() { return false; });\r
- (!$.browser.safari && mousescreen.css({ cursor: 'url(images/blank.cur), auto' }));\r
+ mousescreen.css('cursor', 'url(' + noneUrl + '), crosshair');\r
+ (($.browser.safari || $.browser.opera) && mousescreen.css('cursor', 'crosshair'));\r
}\r
var testStop = function() {\r
+ $(el).unbind("mouseover", updateCursor).unbind("mouseout", resetCursor);\r
mousescreen.remove();\r
mouseX = realmouse.css("left");\r
mouseY = realmouse.css("top");\r
var lastX = null;\r
\r
fakemouse\r
- .animate({ left: left, top: top }, "fast", function() {\r
+ .animate({ left: left, top: top }, "slow", function() {\r
+ $(el).triggerHandler('mouseover');\r
testMouseDown(el, left, top);\r
testMouseMove(el, left, top);\r
})\r
.animate({ left: left + dx, top: top + dy }, {\r
- speed: "fast",\r
+ speed: "slow",\r
easing: "swing",\r
step: function (xory) {\r
if (!lastX) {\r
lastX = xory;\r
} else {\r
- testMouseMove(el, lastX, xory);\r
+ var x = lastX, y = xory;\r
+ testMouseMove(el, x, y);\r
lastX = null;\r
}\r
},\r
complete: function() {\r
+ $(el).triggerHandler('mouseout');\r
testMouseUp(el, 0, 0);\r
$(this).animate({ left: realmouse.css("left"), top: realmouse.css("top") }, {\r
- speed: "fast",\r
+ speed: "slow",\r
complete: function() {\r
testStop();\r
}\r