2016-09-26 3 views
1

私は特定の領域(div)にカーソルを隠し、別の領域にカスタムカーソルを表示する必要があるウェブページを開発していました。 これは、すべてのブラウザで完璧に動作しますが、Firefox Macの場合は、カーソルが隠れてしまいます。私はこの問題(JSFiddle Link)の原因となっているコードを取り出しました。 カーソルが完全に消えるかの時点で、空白とテキスト領域との間に連続してカーソルを移動しようと、全く見ることができません - ここFirefox Macでカーソルが消えてリセットされない

$("#left").mousemove(function(event) { 
    leftDiv.style.cursor = "none"; 
    console.log("Left - " + leftDiv.style.cursor); 
}); 

$("#right").mousemove(function(event) { 
    rightDiv.style.cursor = "url('http://cur.cursors-4u.net/cursors/images11/cur1047.png'), auto"; 
    console.log("Right - " + rightDiv.style.cursor); 
}); 

は、それを再現することができる方法です。この問題を解決するには、いくつかの回避策がありますか? here

答えて

0

フォルスバックが "auto"のURLを使用すると、カーソルを非表示にする代わりに "none"プロパティを使用する代わりに、機能しました。

$("#left").mousemove(function(event) { 
leftDiv.style.cursor = "url('http://www.jholjhaal.com/wp-content/uploads/2013/05/HiddenCursor.cur'), auto"; 
console.log("Left - " + leftDiv.style.cursor); 
}); 

$("#right").mousemove(function(event) { 
rightDiv.style.cursor = "url('http://cur.cursors-4u.net/cursors/images11/cur1047.png'), auto"; 
console.log("Right - " + rightDiv.style.cursor); 
}); 

そして、このアプローチの問題は、URLで指定されたリソースが存在しない場合は、ブラウザのデフォルトのカーソルが代わりに隠れの現れだろう、ということです。

関連する問題