在MVC3中設置遊標CSS的正確方法是什麼？

$('#spanContainingImage').hover(function() { 
      //$(this).css('cursor',"vertical-text");//this works 
      console.log('hover');//this is called 
      $(this).css('cursor', "url('http://localhost:12062/Content/themes/base/images/G.cur')");//this fails 
     });

我嘗試了硬編碼我的URL，我仍然無法讓光標通過URL更改。怎麼了？在MVC3中設置遊標CSS的正確方法是什麼？

來源

2011-12-09 P.Brian.Mackey

當您在瀏覽器中訪問http：// localhost：12062/Content/themes/base/images/G.cur時會發生什麼？ IIS/IISExpress/Cassini是否具有.cur擴展名的MIME類型？ – danludwig

@olivehour - 我看到一個空白頁。我嘗試訪問具有不良映像名稱「/ badimage.no」的目錄並出現錯誤。 –

如果在該文件夾中沒有名爲badimage.no的文件，則會收到HTTP 404錯誤。但是，我要檢查的第一件事是服務器是否不顯示圖像，因爲它不瞭解.cur擴展名的MIME類型。 – danludwig

一些研究MDN後說：

[...]的零個或多個URL可以被指定（逗號分隔），其必須後跟CSS規範中定義的關鍵字之一，如自動或指針。

所以我加入了auto修改我的jQuery

var url = 'url(@Url.Content("Content/themes/base/images/G.png")), auto';    
$(this).css('cursor', url);

現在，它的工作原理。

請注意，它也聲明你必須堅持.CUR和.ANI以保持IE6兼容性（希望它列出的IE7）。

來源

2011-12-09 20:00:00

你應該仍然使用文件的相對路徑而不是硬編碼的 –

@bobek好的一點。 +1給你的答案。 –

嘗試：

$('#spanContainingImage').hover(function() { 
      //$(this).css('cursor',"vertical-text");//this works 
      console.log('hover');//this is called 
      $(this).css('cursor', "url(" + '@Url.Content("~/Content/themes/base/images/G.cur")' + ")");//this fails 
     });

來源

2011-12-09 19:18:50

還是不行。在這兩種情況下，我都沒有在Firebug控制檯窗口中看到任何錯誤。 –

您是否在控制檯中嘗試這樣做：'$（'＃spanContainingImage'）.css（'cursor'，'url（「pathhere」）'）;'也將文件放在活動服務器上並使用該路徑 –

剛纔看了一個工作例如在W3Schools的。您是否嘗試過不引用您的網址？即

URL（HTTP：//本地主機：12062 /內容/主題/鹼/圖像/ G.png）

代替

URL（「HTTP：//本地主機：12062 /內容/主題/鹼/圖像/ G.png'）

來源

2011-12-09 19:25:02 danludwig

直接訪問該URL顯示該圖像。光標不會改變。 AFAIK您需要使用* .cur文件來更改光標圖像。 –

我很困惑：直接訪問網址是否顯示圖像？你在一個評論中說，它確實存在，而在另一個評論中，它沒有。 – danludwig

直接訪問.cur版本的圖像不*顯示。直接訪問圖像的.png版本確實顯示。 –

在MVC3中設置遊標CSS的正確方法是什麼？

回答

相關問題