當鼠標懸停在其他css類上時改變類的屬性

當類「left1_sub」被徘徊時，我想給class「left2」的div一個邊界半徑。當鼠標懸停在其他css類上時改變類的屬性

我搜索了很多解決方案，但似乎沒有任何工作適合我。

HTML以它：http://web318.login-11.hoststar.at/ben/kleinraum/wp/menuimg/index.html 和完整的CSS：http://web318.login-11.hoststar.at/ben/kleinraum/wp/menuimg/style.css

.left1_sub{ 
    padding-top:2%; 
    padding-bottom:2%; 
    width: 100%; 
    float: left; 
    background-color: #cccccc 
} 



.left1_sub:hover ~ .left2 {border-radius: 10px;} 

.left2{ 

    float: left; 
    margin-right: 20px; 
    margin-top: 20px; 
    width: 500px; 
    height:600px; 
    background-color: #ccccff 
}

只是介紹自己CSS3很抱歉，如果有故障。

ben

來源

2012-11-26 mordondro

安置自己的HTML *這裏*，在*題*。請不要期望用戶訪問您的網站，然後查看源代碼以幫助您。使*容易*爲*我們*來幫助*你*。此外，[JS小提琴]（http://jsfiddle.net/）或類似的，現場（[SSCCE]（http://sscce.org/））演示（我們可以看到代碼，*，重要的是*，*編輯它*無需下載並創建我們自己的演示程序就可以獲得我們的幫助很長的一段路要認真地請：幫助*我們*幫助您* –

這可以用jQuery或類似的東西很容易地完成。

如果舒服的使用jQuery，就可以這樣工作。

首先，在CSS一類帶有邊框半徑：

.rounded { border-radius: 5px; /* (or whatever) */ }

然後，在<script>標籤：

jQuery(document).ready(function($) { 
    var obj = $('.left1_sub'), 
     target = $('.left2'); 

    obj.hover(
      //mouse in 
     function(){ 
      target.addClass('rounded'); 
     //mouse out  
     },function(){ 
      target.removeClass('rounded'); 
    }); 

});

http://jsfiddle.net/wGzgB/11/

來源

2012-11-26 14:46:51 Calvin

關於爲什麼提供JavaScript作爲解決方案：CSS不允許選擇OP所要求的類型，CSS只能遍歷DOM（IE - 兄弟和兒童），而不是它（IE - 你不能從孩子選擇一個父元素）。由於OP的HTML需要從包含「left1_sub」的元素中去到「left2」，所以JavaScript或者HTML重構對於實現OP的目標是必要的。 – Shauna

hey！thx爲答案，將會嘗試對於這種特殊情況，但我仍然在尋找一種方法來完成它，因爲我想在更復雜的東西上使用這種方法。 – mordondro

As @Shauna has說，這將不可能與純粹的CSS沒有HTML重組 – Calvin

當鼠標懸停在其他css類上時改變類的屬性

回答

相關問題