javascript - 将鼠标悬停在 div jquery 上的文本更改不透明度

标签 javascript jquery html css jquery-hover

我有一个包含不同单词的列表面板,每个单词在右侧解释一个 div。 我试图在悬停匹配词时将匹配 div 的不透明度更改为 1.0。

<html> #HTML SETUP 
 <div class="Settings">
   <ul>
    <li class="SettingsSlideshow">
     <h3>Slideshow</h3>
    </li>
    <li class="SlideshowImage">
     <h4>Image</h4>
    </li>
    <li class="SlideshowTitle">
     <h4>Title</h4>
    </li>
   </ul>
  </div>

 <div class="Slideshow">
 </div>
</html> 

<script type="text/javascript"> #JAVASCRIPT
$(function(){
 $(".SettingsSlideshow").hover(function(){
  $(".Slideshow").css({opacity: 1.0});
 });
});
</script>

这只是我要实现的目标之一。这不起作用,我还需要在 css 中定义 x:hover 吗?我在 css 中的每个 div 上定义了一个不透明度:0.7。 Mabye 我需要定义它:(".Settings ul li SettingSlideshow")?

感谢您的帮助!

最佳答案

<script type="text/javascript">
$(function(){
 $(".SettingsSlideshow").hover(function(){
  $(".Slideshow").css({opacity: 1.0});
 },function(){
$(".Slideshow").css({opacity: 0.0});// here set your rest opacity between 0 to 1

});
});
</script>

引用 hover

关于javascript - 将鼠标悬停在 div jquery 上的文本更改不透明度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18823938/

相关文章:

javascript - 在 highcharts 系列中传递 3 个值

javascript - 如何为选定的段落设置动画?

javascript - 满足条件时从数组中提取值

javascript - HTML5 + JS : Tracking user interaction

php - 网站上的服务器端随机数生成器

javascript - 如何知道是否正在加载javascript youtube iframe api

javascript - 无法将 CSS 更改应用于通过 JS/JQuery 动态创建

javascript - 未捕获的 TypeError 无法设置 null 的属性 'src'

javascript - 等待异步调用不适用于ajax

javascript - MobX 和 HMR : Please avoid replacing stores as the change might not propagate to all children