1
기본적으로, 저는 "자석"처럼 행동하는 특정 웹 사이트를 원합니다. 이 중 하나 근처에있는 경우이 jQuery 플러그인과 비슷한 창이 맨 위로 스크롤해야합니다. http://benoit.pointet.info/stuff/jquery-scrollsnap-plugin/jQuery는 스크롤 위치를 조정하지 않습니다.
문제는 페이지가 " 자석".
이$(document).ready(function() {
var magnets = [];
var range = 200;
var active = true;
$('.container').each(function(i,obj) {
magnets.push($(this).offset().top);
});
console.log(magnets);
var attract = function(where,time){
$('html, body').animate({
scrollTop: where
}, time);
active = false;
};
//checks the range of a magnet
var magnetic = function(what){
var top = $(window).scrollTop();
var min = top - range;
var max = top + range;
if((min <= what) && (max >= what)){
return true;
} else{
return false;
}
}
//returns, wether you are in range of a magnet from your magnets array or not
var inRange = function(){
var magnet = -1;
for(var i=0; i<magnets.length; i++){
if(magnetic(magnets[i]) == true){
magnet = i;
}
}
return magnet;
}
$(window).scroll(function() {
$('.counter').html("");
$('.counter').append("<p>"+inRange()+"</p>");
if(active == true && inRange != -1){
attract(magnets[inRange()]);
}
else if(active == false && inRange() == -1){
active = true;
}
else if(active == true && inRange() == -1){
console.log("fuck");
}
});
});
대안 codepen 링크 : 코드에 무슨 문제가 있나요 http://codepen.io/NiclasvanEyk/pen/jEMrZr이