Javascript 悬停div时如何影响图像的不透明度？

我很快就要实现我想要的。。。但是我想知道我是否已经达到了css的极限

如果您导航到

我们有一个产品滑块。我正试图得到它，这样

1） 产品在加载时以100%不透明度开始。 2） 将鼠标悬停在产品上。。你在上面悬停的那一个保持100%的不透明度，其他的都说不透明度为0.5（变暗）

---

我几乎用css实现了这一点。你可以看到它的工作，除了，当你悬停在描述弹出。。。活动图像的不透明度恢复为0.5。当鼠标悬停在弹出窗口描述上时，是否可以控制此图像的不透明度？我真的希望如此！如果不行。。。我怎样才能用js实现这一点？在这里看了一些，但没有一个真正适用于我的情况。希望我提供了足够的信息让你理解。干杯

当用户不悬停时，这应该适用于图像的不透明度

divName img {
 opacity:0.3;
 filter:alpha(opacity=30);(IE)
}

然后当他们悬停时（这应该包括你的产品信息样式，就像你悬停时显示的那样。）

还可以在开始时加入一个活动类，以便在页面加载时至少显示一个产品

例如：

divName img .activeLoad{
 opacity:1.0;
 filter:alpha(opacity=100);(IE)
}

---

#containingDiv:hover img{}

将在任何包含div的部分悬停时影响img，因此我会使用，如果我是你，Ryan的解决方案将仅在你悬停在img上时影响img

我拿起你的html并将其放在小提琴上。看一看

不管怎样，这就是你基本需要的。我用这些选择器过度指定了，但我这样做是为了让您更好地理解

#slider-list-stick-1:hover .slide-index{
    opacity: 0.5;
    filter:alpha(opacity=50); //ie
}

#slider-list-stick-1 .slide-index:hover {
    opacity: 1;
    filter:alpha(opacity=100); //ie
}

---

将此声明添加到样式中

.slide-index:hover img{
    opacity: 1;
}

---

由于其他

div

s也在

slide index

容器中，因此

悬停

效果仍将应用。

您可能将鼠标悬停在图像上，而不是同时包含图像和弹出描述的容器上。您好，感谢大家的输入。我尝试了解决方案1，但没有成功。我想这是因为我有一点wierd html设置，它不像几个div和几个图像那样直接。如果有人能看一看firebug什么的，让我知道确切的代码。。。我已经试了很多次了，我现在都迷路了。我不知道这是我糟糕的css，还是根本不可能。。太完美了。。。。除了当您将鼠标悬停在弹出窗口描述上。。。。。当需要保持1.0不透明度时，产品图像变暗。。我希望你能理解。啊，糟透了，当乔普洛回答时，我刚帮你整理好，只是更改了div ID/类的名称。啊，很高兴你把它整理好了：）是的！！！就是这个！谢谢你，伙计，你不知道我在tat上工作了多久：）我来看看它是怎么工作的。。我之前用了大约12行css得到了类似的结果：））Excellt。谢谢你。幻灯片索引从何而来？在我的试错过程中从未尝试过；）没问题，很高兴我帮了忙！

.slide-index:hover img{
    opacity: 1;
}