我可以使用什麼CSS來管理曲線列表項目效果？

Question

我想把一個3d彎曲的外觀放在列表項中，當我將鼠標懸停在我的邊欄上的列表項上時。

我該如何做到這一點與CSS？

編輯::

我有一個側欄中的列表。

當我將鼠標懸停在鏈接我想它看起來好像它是一個圓柱體

Answer 1

您可以更改列表項的背景包含一個3D曲面圖像

li:hover{ 
    background: url(/images/curved3Dbackground.png); 
} 

因爲IE6只支持錨元素這種類型的哈弗，你可能要懸停適用於內錨列表元素

HTML

<li><a href="link.html">Text</a></li> 

CSS

li a:hover{ 
    background: url(/images/curved3Dbackground.png); 
} 

Answer 2

的懸浮效果，你簡單做的onmouseover和onmouseout的曲面上寫...

Readm更多：

http://bavotasan.com/tutorials/a-simple-mouseover-hover-effect-with-jquery/

所以：

• 獲得基本的圖像
• 獲得3D圖像
• 當鼠標拿到過項目 - >的onmouseover設置3D圖像
• 當鼠標離開項目 - > OnMosueOut折戟基本圖像

Answer 3

我會認爲你需要一個背景圖片來做到這一點。所有的瀏覽器都支持錨標籤上的懸停屬性（我懷疑你用於你的菜單容器），但一些較新的支持所有元素的懸停屬性。我知道firefox支持這個

div:hover{background-image:url(myImage.png);} 

然後只是背景圖像你的3d彎曲的事情。