无限滚动在tumblr上加载新页面后,Jquery脚本停止工作
我有paul irish的无限卷轴插件正在运行,我还有一个脚本,当我将鼠标悬停在我的帖子上时,它会在我的帖子上显示一个下拉div,但是,在无限卷轴加载了第一组帖子之后,下拉列表就乱了 我的下拉代码如下所示:无限滚动在tumblr上加载新页面后,Jquery脚本停止工作,jquery,drop-down-menu,tumblr,infinite-scroll,Jquery,Drop Down Menu,Tumblr,Infinite Scroll,我有paul irish的无限卷轴插件正在运行,我还有一个脚本,当我将鼠标悬停在我的帖子上时,它会在我的帖子上显示一个下拉div,但是,在无限卷轴加载了第一组帖子之后,下拉列表就乱了 我的下拉代码如下所示: <script type="text/javascript"> $(function() { $('.entry').hover(function() { $(this).find('.notes').slideToggle(12
<script type="text/javascript">
$(function() {
$('.entry').hover(function() {
$(this).find('.notes').slideToggle(125);
});
});
</script>
$(函数(){
$('.entry').hover(函数(){
$(this).find('.notes').slideToggle(125);
});
});
我知道我必须在无限滚动加载后调用它,所以我将它添加到我的无限滚动插件中,如下所示:
<script type="text/javascript">
$(document).ready(function(){
$('#content').infinitescroll({
navSelector : "div.navigation",
nextSelector : ".navigation a#next",
itemSelector : ".entry",
bufferPx : 50,
animate : 'true',
extraScrollPx: 150,
loading: {
finished: undefined,
finishedMsg: "Congratulations, you've reached the end of the internet.",
img: "http://static.tumblr.com/8je4mhi/aLbmpfjp5/1.gif",
msg: null,
msgText: "",
selector: null,
speed: 'slow',
start: undefined
},
},function(newElements){
$('.entry').hover(function() {
$(this).find('.notes').slideToggle(125);
});
});
});
</script>
$(文档).ready(函数(){
$('#content')。无限滚动({
导航选择器:“div.navigation”,
下一个选择器:“.导航a#下一个”,
itemSelector:“.entry”,
缓冲区px:50,
动画:“true”,
外星X:150,
装载:{
完成:未定义,
finishedMsg:“祝贺你,你已经到达了互联网的尽头。”,
img:“http://static.tumblr.com/8je4mhi/aLbmpfjp5/1.gif",
msg:null,
msgText:“”,
选择器:null,
速度:“慢”,
开始:未定义
},
},函数(新元素){
$('.entry').hover(函数(){
$(this).find('.notes').slideToggle(125);
});
});
});
但这把事情搞砸了。默认情况下,它会使第一组帖子可见,并在悬停时隐藏,之后的下一组帖子将隐藏,但在切换时不会保持显示状态
如果有帮助,我这里有我的示例站点:
如果有帮助的话,这里还有我的完整html标记:
也许有人能指出我哪里出了问题?您会想利用jQuery的
on()
函数
只需将初始代码更改为:
$('#content').on('hover', '.entry', function () {
$(this).find('.notes').slideToggle(125);
});
…并删除无限滚动回调中的悬停函数
更多信息可以在这里找到:我自己永远也不会明白,你太棒了!非常感谢你的帮助,格雷!