[英]jQuery: show element on when specific div overflow is scrolled 100px?
normally I use this on some of my projects. 通常我会在我的一些项目中使用它。
//Back to top
$(window).scroll(function () {
if ( $(window).scrollTop() > 100 ) {
$('#back-to-top').fadeIn('fast');
} else {
$('#back-to-top').fadeOut('fast');
}
});
$(window).scroll();
This means whenever a user scrolls more like a 100px down from the top a back-to-top arrow is fading in. 这意味着每当用户从顶部向下滚动更像100px时,返回顶部的箭头就会消失。
This time I have a horizontal scrollbar inside a div that has it's overlow-x
set to auto
. 这次我在div中有一个水平滚动条,它的
overlow-x
设置为auto
。 Looks like this… 看起来像这样......
<section id="slider" class="horizontal">
<!-- Some Images that are floated left -->
<div id="back-to-left"></div>
</section>
.horizontal {
overflow-x: auto;
white-space: nowrap;
padding: 20px 0;
}
So it's just a div with a lot of images side by side and a horizontal scrollbar at the bottom of this div. 所以它只是一个div,有很多图像并排在这个div底部的水平滚动条。
I only want to show this #back-to-left
button when I scroll inside of this div over a certain value - maybe again like 100px. 当我在这个div中滚动超过某个值时,我只想显示这个
#back-to-left
按钮 - 也许再次像100px。
How can I do that in this case? 在这种情况下我该怎么做?
Thank you for your help. 谢谢您的帮助。
You can use scrollLeft()
to determin the position 您可以使用
scrollLeft()
来确定位置
So you would want to do something like 所以你想要做类似的事情
$('#slider').scrollLeft() > 100
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.