最近在做产品详情页的移动端页面，关于两个小问题做个汇总；
首先需要判断的是客户端类型，这里用到了BOM对象中的Navigator对象的相关知识，navigator 对象提供了与浏览器有关的信息。到底提供哪些信息，很大程度上取决于用户的浏览器；不过，也有一些公共的属性（如 userAgent ）存在于所有浏览器中。，不了解的可以先了解下：什么是BOM对象？
下面是封装的判断终端类型的函数，移动端取了所有主流的引擎
function IsPC() {
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone","SymbianOS", "Windows Phone","iPad", "iPod"];
var flag = true;
for (var v = 0; v < Agents.length; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) {
flag = false;
break;
}
}
return flag;
}
成功区分终端类型后，就可以进行返回顶部操作了，根据不同的需求使用锚链接或scroll
这里附上scroll方法的代码：
function rttop($el,showheight,pcspeed){
$(window).scroll(function(){
if($(window).scrollTop()>=showheight){
$el.stop().show();
}else{
$el.stop().hide();
}
})
$el.click(function(){
var nowscroll=$(window).scrollTop();
var timer = setInterval(function aa() {
var winscroll = $(window).scrollTop();
if(winscroll > 1){
if (IsPC()==true) {
document.documentElement.scrollTop*=pcspeed;
}
else{
if (nowscroll >1800) {
$('body').scrollTop(0);
}
else if (nowscroll>700&&winscroll<1800) {
$('body').scrollTop($('body').scrollTop()-100);
}
else if (winscroll<700) {
$('body').scrollTop($('body').scrollTop()-40);
}
}
}else{
clearInterval(timer);
}
},20);
})
}
参数详解：
$el：返回按钮元素节点
showheight：决定了下滑至哪里时按钮出现
pcspeed：控制了PC端的返回速度（移动端速度也可传参控制，这里不做解释）
至于为什么要区分终端，因为实际测试时发现document.documentElement.scrollTop*=pcspeed在移动端不生效，只好改用jquery选择器选中body，具体原因不详，希望有大佬来解惑。
