如何使用svg作爲光標

我試圖使用svg圖像作爲光標時，鼠標懸停在某個div上，但我無法得到它的工作。我讀過它應該是這樣簡單，只要添加：如何使用svg作爲光標

cursor: url(http://elusivethemes.com/assets/down.svg), auto;

但它似乎不工作。奇怪的是，它是有效的，如果我使用不同的URL從不同的SVG圖像。

任何想法？

在此先感謝。

來源

2016-06-21 Scott Hunter

也許嘗試下載資源並在本地託管它。 – Quantastical

@HunterTurner我不會將此限定爲[爲CSS客戶遊標使用外部圖像]（http://stackoverflow.com/questions/18551277/using-external-images-for-css-custom-cursors）的副本該問題僅提及基於圖像的遊標。當前的問題是由於所使用的圖像是沒有聲明尺寸的SVG。因此，我不會將其標示爲該問題的重複。 – GaijinJim

按照Mozilla Developer Network

與壁虎2.0開始（火狐4/3.3雷鳥/ SeaMonkey的2.1），壁虎還支持用於遊標SVG圖像格式。 但是，SVG 圖像必須在其根SVG節點上包含長度值（不是百分比值）高度和寬度值。 JavaScript，CSS動畫和聲明式 SVG圖像中的SMIL被忽略;例如，您無法使用SVG創建一個動畫光標。

因此，您應該在.svg文件中明確聲明高度和寬度。

您提供的.SVG沒有尺寸聲明，你可以看到：

<svg xmlns="http://www.w3.org/2000/svg" id="Capa_1" viewBox="0 0 320.995 320.995" x="0px" y="0px" height="200" xmlns:xml="http://www.w3.org/XML/1998/namespace" xml:space="preserve" viewbox="0 0 320.995 320.995" version="1.1">

如果添加width和height屬性，你應該罰款。
只要確保你沒有聲明尺寸百分比

來源

2016-06-21 20:55:28 GaijinJim

好的謝謝你。我是否在css或svg本身中聲明寬度和高度？ –

我可能是錯的，但我相信它必須在SVG本身。不過，我會盡力做到這一點，以防萬一 – GaijinJim

如果我能解決你的問題，如果你能接受我的答案，這將是非常好的。 – GaijinJim

如何使用svg作爲光標

回答

相關問題