微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript-jQuery hoverIntent插件出现cfg.hover错误

我正在尝试使用hoverIntent插件延迟进度条上的某些动画效果.但是,由于某种原因,hoverIntent似乎根本无法运行.

我的页面标题中包含以下内容(所有路径均已通过验证):

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="campaign-resources/_js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="campaign-resources/_js/jquery.hoverintent.js"></script>
<script type="text/javascript" src="campaign-resources/_js/sitewide.js"></script>

在sitewide.js中,我运行以下命令:

$(".cause-block").hoverIntent(function() {
    var originalWidth = $(this).find(".cause-chart-achieved").css("width");
    var chartParams = { width: originalWidth };
    $(this).find(".cause-chart-achieved").css("width", "0");
    $(this).find(".cause-chart-achieved").animate(chartParams, "slow", "easeInOutSine");
});

但是,当我将鼠标悬停在相关的div上时,浏览器中没有任何反应,并且控制台显示以下错误

“ cfg.over未定义”和“ cfg.out未定义”

我已经使用jQuery的内置“悬停”功能进行了测试,并且效果很好.我还认为这可能与easing插件存在冲突,但是在HTML和JS文件删除对easing插件的引用后,我仍然遇到相同的问题.最后,为了安全起见,我删除了所有其他自定义JS,但问题仍然存在.

有任何想法吗?谢谢!

解决方法:

hoverIntent需要2个参数,

$(".cause-block").hoverIntent(function() {
    var originalWidth = $(this).find(".cause-chart-achieved").css("width");
    var chartParams = { width: originalWidth };
    $(this).find(".cause-chart-achieved").css("width", "0");
    $(this).find(".cause-chart-achieved").animate(chartParams, "slow", "easeInOutSine");
},
function(){});

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐