js scrollTop reaches the specified location
The method mainly uses the scrolltop value to move, which is used to reach the position specified by the user (such as returning to the top and setting the parameter target to 0). It handles various situations such as scrolltop > target value moving upward, etc., and post the code and usage.
goTo = function(target){
var scrollT = ||
if (scrollT >target) {
var timer = setInterval(function(){
var scrollT = ||
var step = (-scrollT/6);
= = step + scrollT;
if(scrollT <= target){
= = target;
clearTimeout(timer);
}
},20)
}else if(scrollT == 0){
var timer = setInterval(function(){
var scrollT = ||
var step = (300/3*0.7);
= = step + scrollT;
(scrollT)
if(scrollT >= target){
= = target;
clearTimeout(timer);
}
},20)
}else if(scrollT < target){
var timer = setInterval(function(){
var scrollT = ||
var step = (scrollT/6);
= = step + scrollT;
if(scrollT >= target){
= = target;
clearTimeout(timer);
}
},20)
}else if(target == scrollT){
return false;
}
}Usage function(target) / / Currently the only target (target distance number),
on(goPs,'click',function(){ goTo(2450) }); //Move to the position where the scrolltop value is 2450, the same is true below, Move to the designated positionon(goJob,'click',function(){ goTo(3373) })on(goTel,'click',function(){ (3373) })；
on(goMe,'click',function(){ (1539) })on(goHome,'click',function(){ (0) });
on(scrollgoOne,'click',function(){ (2450) });on(scrollgoPc,'click',function(){ (2450) });
on(scrollJob,'click',function(){ (3373) });on(scrollMe,'click',function(){ (1539) });
on(goTop,'click',function(){ (0) })Native js get scrollTop
1. The difference between scrollTop in each browser
IE6/7/8：
- For pages without doctype declarations, you can use to get scrollTop height;
- For pages with doctype declarations, you can use it;
Safari：
- safari is quite special, it has its own function to obtain scrollTop: ;
Firefox：
- Firefox and other relatively standard browsers are much more worry-free, so use them directly;
2. Get scrollTop value
Perfectly obtain scrollTop assignment phrase:
var scrollTop = || || ;
This assignment allows you to obtain the scrollTop value in any case.
If you observe this assignment carefully, what have you found? ?
That's right, it's that (Safari) is placed in the middle of ||.
Because when the number 0 is performed or operated with undefined, the system returns the last value by default. Even if the operation is 0 == undefined ;
When the page scrollbar is just at the top, that is, the scrollTop value is 0. Under IE, (Safari) returns to undefined. When (Safari) is placed at the end of the or operation, scrollTop returns undefined. If the undefined operation is used in the next operation, an error will be reported.
Other browsers will not return undefined regardless of scrollTop assignment or operation order. It can be used safely...
So at the end it is still the IE problem.
I was a little dazed and I don’t know if I had expressed it clearly.
However, in the end, this sentence has been summarized as OK and everyone can use it with confidence;
var scrollTop = || || ;
The above is personal experience. I hope you can give you a reference and I hope you can support me more.