【发布时间】：2013-01-12 13:50:27
【问题描述】：
为了澄清：当您将鼠标悬停在图像上时，我不是在问如何使图像变暗。我想知道如何使光标周围图像周围的其他图像变暗。
这里是一个例子：http://www.b-reel.com/
当您将鼠标悬停在大类别图像上时，周围的图像变暗，但悬停的图像保持不变。
任何意见将不胜感激。谢谢！
【问题讨论】：
【发布时间】：2013-01-12 13:50:27
【问题描述】：
您不会使周围的图像变暗。相反，您所做的是在所有图像周围放置一个div，当光标在这个div 上时，所有图像都变暗。但是您还可以在每个图像周围添加div 元素，并且当光标在图像上方时，您可以使图像不那么暗。两者的结合会给你想要的效果。
【讨论】：
-
我是Jquery的菜鸟，所以我决定先试试你的方法。为了我的设计，我使用背景图像而不是图像。我可以让所有图像在悬停时变暗，但是我无法让单个图像在悬停时保持 100% 的不透明度。这是我的代码的简化版本：编辑：我是格式化这些帖子的新手，对不起！！
-
<style> #all { width: 600px; height: 200px; background: #000; } #all:hover { opacity: 0.5; } .square { float: left; width: 200px; height: 200px; background: url(img.jpg); } .square:hover { opacity: 1.0; } </style> <div id="all"> <div class="square"></div> <div class="square"></div> <div class="square"></div> </div> -
请将您的代码添加到原始消息中，这将使阅读更容易。其实放在jsFiddle上会更好。
-
感谢您的耐心等待。 Here's the jsFiddle. 如您所见，我正在努力让各个方块突出显示。
在您发布的示例中，他们使用 JavaScript 在其他 div 上应用 .fadeOut 类。 .fadeOut 类将其他 div 的 opactiy 设置为 50%。
【讨论】：