class - 将鼠标悬停在其他 css 类上时更改类属性

Question

当悬停类“left1_sub”时，我试图给类“left2”的 div 一个边框半径。

我搜索了很多解决方案，但似乎没有一个适合我。

它的 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
}

只是 self 介绍 css3，如有错误，请见谅。

本

Answer 1

这可以用 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/