CSS3過渡顯示滾動條而不是標籤的內容

我爲網站上的菜單創建了過渡效果。當我將鼠標懸停在元素上時，它不會顯示我想要查看的內容。相反，滾動條出現。這意味着過渡效果在這個菜單上工作，但是頁面不會顯示菜單內容。我的菜單位於頁面的底部。請參閱下面的我的代碼。謝謝CSS3過渡顯示滾動條而不是標籤的內容

.change_height { 
overflow:hidden; 
height: 20px; 
transition: height 3s; 
} 
.change_height:hover 
{ height: 198px; }

2013-06-04 Chathuraka

請在網站上顯示完整源代碼（包括HTML）的示例，或者在jsfiddle.net上顯示更好的例子 –

Works fine [in this jsfiddle]（http://jsfiddle.net/h6wm2/） – Stasel

代碼似乎很好。你不需要隱藏溢出。

.change_height { 
background:blue; 
height: 20px; 
transition: height 3s; 
} 
.change_height:hover{ 
height: 198px; 
}

你能否提供更多。

2013-06-04 05:14:02 hyperdrive

我的菜單位於頁面的底部。當我將鼠標懸停在標籤上時，我需要菜單來自下方。簡單地說整個頁面應該顯示底部的菜單。我試圖通過使用css3過渡來增加高度來實現。但它沒有發生。滾動條上升而不是我需要看到的。謝謝 – Chathuraka

這是你要找的嗎？請張貼代碼。 http://jsfiddle.net/y55sz/2/ – hyperdrive

單獨使用CSS即使使用動畫也不會導致瀏覽器自動滾動。您需要使用懸停時觸發的JavaScript。

從可用性的角度來看，我不知道爲什麼你想菜單出現在那個位置？如果觸發它的元素總是在頁面的底部，爲什麼不讓它動畫向上？

2013-06-04 12:22:38 TomCollinson

回答