手机实现翻屏

来源:互联网 发布:淘宝客怎么玩才能赚钱 编辑:程序博客网 时间:2024/06/11 11:16

 
/**
 这些数据可以自己控制,设置那个键具体代表什么含义。

*/
var currentpage=1;
function pageResult(page){
 var weight=0;
 var height=0;
 //可以定位水平显示的位置
 //var setWeight=document.body.scrollHeight/totleNum;
 //定位树直方向位置 ,分几屏显示数据
 //每一屏幕的大小(根据显示屏幕的大小显示availHeight,availWidth)
 var screenHeight=window.screen.availHeight;

 //可以显示几屏(可滚动屏幕大小 scrollWidth,scrollHeight)
 var setHeight=document.body.scrollHeight/screenHeight;//(只是IE6    以后才支持)
 //var setHeight=document.documentElement.scrollHeight/screenHeight;//对于不同的浏览器显示不一样。
 //可以但是都要有一个统一的ID body体
 //var setHeight=document.getElementById("body").scrollHeight/screenHeight;
 //按上下左右件(2、8、4、6)
 //向上翻屏   按手机键盘键2 或按箭头上
 if(event.keyCode==38 || event.keyCode==104){
  if(currentpage>0){
   currentpage--;   
  }
  height=screenHeight*currentpage;
 }
 //向下翻屏  按手机键盘8 或按箭头下
 if(event.keyCode==40 || event.keyCode==98){
  if(currentpage<=setHeight){
   currentpage++;  
  }
  height=screenHeight*currentpage;
 }
 //回到开始4 或 左
 if(event.keyCode==37 || event.keyCode==100){
  height=0; 
 }

 //结束 按箭头右 或 按6
 if(event.keyCode==39|| event.keyCode==102){
  //height=document.getElementById("body").scrollHeight; 
  height=document.body.scrollHeight;
  //height=document.documentElement.scrollHeight;
  alert(height);
 }
 if(event.keyCode==13){
  window.location.href="http://www.baidu.com";
 }
 window.scrollTo(0,height);

}
//导入js后默认为加载事件
window.document.onkeydown=pageResult;

 

原创粉丝点击