javascript - jquery 动画不透明箭头 mouseenter mouseleave

标签 javascript jquery html css jquery-animate

当我们经过箭头导航时,我正在尝试使用 jquery 添加不透明效果,但似乎没有任何反应:(。你知道我的 Jquery 脚本有什么问题吗。

这是我的 Jquery:

$(document).ready(function(){
  $(".flscroll").mouseenter(function(){
    $("flscroll").animate({opacity:1},300);
  });
  $(".flscroll").mouseleave(function(){
    $(".flscroll").animate({opacity:.8},300);
  });
});

我在我的 CSS 中定义了我的箭头:

.flscroll {
        display:block;
        height: 83px;
        opacity: 0.8;
        position: fixed;
        top: 40%;
        z-index: 1000;
    }
    .ie8 .flscroll {
        filter: alpha(opacity=80);
    }
    #flscrollg {
        background: url(images/sprite.png) no-repeat 50px -100px;
        left: -30px;
        padding-left: 50px;
        width: 52px;
    }
    #flscrolld {
        background: url(images/sprite.png) no-repeat left -200px;
        padding-right: 50px;
        right: -30px;
        width: 53px;
    }

我的 html 箭头声明是这样的:

<a href="#1" title="previous" class="flscroll" id="flscrollg">&nbsp;</a>
<a href="#1" title="next" class="flscroll" id="flscrolld">&nbsp;</a>

最佳答案

所以我在评论中提到,这行代码中可能是您​​的 Jquery 缺少句号

$("flscroll").animate({opacity:1},300);
//Should be
$(".flscroll").animate({opacity:1},300);

我在这个FIDDLE里面加了它工作正常。

这就是你想要的吗?

关于javascript - jquery 动画不透明箭头 mouseenter mouseleave,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23218168/

相关文章:

javascript - 如何在 React/Redux 应用程序中刷新页面后保持登录状态

javascript - Chrome Dev Tools - 你能撤消控制台中的更改吗?

javascript - 我可以确定之前按下了哪个键吗? JavaScript

javascript - jQuery 表单插件 - iframe 问题

javascript - 单击 button1 并将文本添加到 div,单击 button2 并删除文本和 css 样式 button1

html - OpenLayer.Popup.FramedCloud 中无响应的 onclick 事件

html - 防止 Coldfusion 编码 html

javascript - 有没有办法记录 npm install 命令的输出

JavaScript 匹配密码

javascript - 阻止 $(this) 元素上的事件