JJ *_*old 29 javascript jquery
嘿所有,当用户滚动浏览页面上的某些位置时,我需要一个jQuery动作.这甚至可以用jQuery吗？我在jQuery API中查看了.scroll,我认为这不是我需要的.每次用户滚动时它都会触发,但我需要它在用户通过某个区域时触发.
jon*_*ohn 45
使用jquery事件.scroll()
$(window).on('scroll', function() {
var y_scroll_pos = window.pageYOffset;
var scroll_pos_test = 150; // set to whatever you want it to be
if(y_scroll_pos > scroll_pos_test) {
//do stuff
}
});
http://jsfiddle.net/babumxx/hpXL4/
小智 20
jQuery中的Waypoint应该这样做:http: //imakewebthings.github.com/jquery-waypoints/
$('#my-el').waypoint(function(direction) {
console.log('Reached ' + this.element.id + ' from ' + direction + ' direction.');
});
jQuery waypoints插件文档:http://imakewebthings.com/waypoints/guides/jquery-zepto/
Moh*_*een 11
要在一个页面上只触发一次任何动作,我修改了jondavid的片段,如下所示.
jQuery(document).ready(function($){
$triggered_times = 0;
$(window).on('scroll', function() {
var y_scroll_pos = window.pageYOffset;
var scroll_pos_test = 150; // set to whatever you want it to be
if(y_scroll_pos > scroll_pos_test && $triggered_times == 0 ) {
//do your stuff over here
$triggered_times = 1; // to make sure the above action triggers only once
}
});
})
在这里,您可以查看工作代码段的示例;
jQuery(document).ready(function($){
$triggered_times = 0;
$(window).on('scroll', function() {
var y_scroll_pos = window.pageYOffset;
var scroll_pos_test = 150; // set to whatever you want it to be
if(y_scroll_pos > scroll_pos_test && $triggered_times == 0 ) {
alert('This alert is triggered after you have scroll down to 150px')
$triggered_times = 1; // to make sure the above action triggers only once
}
});
})p {
height: 1000px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<p>scroll down this block to get an alert</p>
</body>