CSS滾動按鈕錯誤

我想創建一個下拉按鈕，它幾乎可以工作，除了一個小錯誤。當用戶將鼠標懸停在它們上面時，我有幾個大按鈕可以改變背景顏色，而其中一個按鈕（語言按鈕）會在用戶懸停時在其內部顯示幾個子選項。除了語言按鈕，當用戶將鼠標懸停在其上時，這一切都可以正常工作。如果光標位於按鈕內部，它會改變其顏色，但如果它觸及3個子選項則不會改變顏色。我需要的是一種技術或規則，指出如果用戶將鼠標懸停在其上或用戶懸停在其子元素之一上，該按鈕將更改背景顏色。我如何實現這一目標？這裏的標記：CSS滾動按鈕錯誤

<ul> 
          <li><a href="/home/" title="Go to the Home page" class="current"><span>Home</span></a></li> 
          <li><a href="/about-us/" title="Go to the About Us page" class="link"><span>About us</span></a></li> 
          <li><a href="/products/" title="Go to the Products page" class="link"><span>Products</span></a></li> 
          <li><a href="/services/" title="Go to the Services page" class="link"><span>Services</span></a></li> 
          <li><a href="/news/" title="Go to the News page" class="link"><span>News</span></a></li> 
          <li><a href="/dealers/" title="Go to the Dealers page" class="link"><span>Dealers</span></a></li> 
          <li id="Rollover"><a href="" title="select language" class="link"><span>Language</span></a> 
           <ul> 
            <li><a href="/english/">English</a></li> 
            <li><a href="/french/">French</a></li> 
            <li><a href="/spanish/">Spanish</a></li> 
           </ul> 
          </li> 
          <li><a href="/contact-us/" title="Go to the contacts page" class="link"><span>Contact us</span></a></li> 
         </ul>

在此先感謝！

來源

2010-03-24 Nick

你現在嘗試使用的CSS不起作用？ – 2010-03-24 04:24:43

如果您的翻轉規則位於<a>標記上，那麼這將不起作用，因爲子選項實際上不是錨點的子項，它們是#Rollover的子項。這應該工作：

#Rollover:hover{background-color:<your color here>}

來源

2010-03-24 04:24:12

感謝哥們！ – Nick 2010-03-24 04:31:24

你可以嘗試使用一個JavaScript來添加一個類，當翻轉懸停。如果您使用的是腳本庫如jQuery它會是這樣的：

$('#rollover').hover(function(){ 
     $(this).addClass('hover'); 
     },function(){ 
     $(this).removeClass('hover'); 
     }); 
$('#rollover a').hover(function(){ 
     $(this).parent("#rollover").addClass('hover'); 
     },function(){ 
     $(this).parent("#rollover").removeClass('hover'); 
     });

這個代碼是未經測試，所以可能需要一個調整或兩個，但是這也應該可以解決任何CSS漏洞所出現的IE（假設你正在使用suckerfish類型的菜單）

來源

2010-03-24 04:31:51 JKirchartz

CSS滾動按鈕錯誤

回答

相關問題