Jquery 放大弹出自动滚动正文内容
我已经安装了这个 每次单击缩略图启动lightbox时,背景中的正文内容都会略微向下滚动。有没有办法阻止这一切的发生 我感觉lightbox脚本在某种程度上干扰了我的滚动到顶部代码:Jquery 放大弹出自动滚动正文内容,jquery,magnific-popup,Jquery,Magnific Popup,我已经安装了这个 每次单击缩略图启动lightbox时,背景中的正文内容都会略微向下滚动。有没有办法阻止这一切的发生 我感觉lightbox脚本在某种程度上干扰了我的滚动到顶部代码: // Magnific Popup open inline content $('.open-popup-link').magnificPopup({ type:'inline', midClick: true }); // Magnific Pop
// Magnific Popup open inline content
$('.open-popup-link').magnificPopup({
type:'inline',
midClick: true
});
// Magnific Popup open iframe content
$('.vimeolink').magnificPopup({
type: 'iframe',
});
// Smooth scrolling - https://css-tricks.com/snippets/jquery/smooth-scrolling/
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
// Scroll to top - http://www.paulund.co.uk/how-to-create-an-animated-scroll-to-top-with-jquery
$(window).scroll(function(){
if ($(this).scrollTop() > 100) {
$('.scrollToTop').fadeIn();
} else {
$('.scrollToTop').fadeOut();
}
});
// Click event to scroll to top
$('.scrollToTop').click(function(){
$('html, body').animate({scrollTop : 0},800);
return false;
});
$('a[href*=#]:not([href=#])
匹配单击的图像,例如
。因此,当您单击图像时,不仅会显示弹出窗口,而且页面会滚动到URL中的哈希,在这种情况下,a#项目
您可以通过添加类来区分锚定的
和图像的
,例如:
<a class="scroller" href="#whatever"></a>
<a class="open-popup-link" href="#popup-183">
您也可以尝试使用。该插件没有在链接中使用href属性来显示内容,因此您不会遇到这个问题。它也更易于使用,而且他们的文档更好(IMO)。很有意义,谢谢。您知道是否有解决方法吗?当然,我已经更新了答案。只要给他们上课就行了。
$('a.scroller').click(function() { /* scrolling stuff */ }