1、如果你的你有很多的页面,那么在访问当前页面的时候,中途又去看了别的页面,那么怎么让你返回的时候使页面依然停留在开始访问的位置呢?这里我用到的是scroll.
首先是写一个公共的记录页面滚动的方法可以理解为java里面的接口:
scroll=(function(){
var list =[];
$(window).scroll(function(){
for (var i=0;i<list.length;i++){
if(list[i].scroll){
list[i].scroll(this.scrollY);
}
}
});
return {
addListener:function(page){
list.push(page);
}
removeListener: function (page) {
for(var i = 0, len = list.length; i < len; i++) {
if(list[i].name == page.name) {
list.splice(0, i);
}
}
};
})();
2、公共的scroll方法写好了,怎么去调呢?
这个就要注入到每个page里面去了,这样页面滚动的时候无论是哪个页面都知道此时页面在滚动。
scroll.addListener(this); 通过scroll调里面的addlistener方法把当前页面放到里面。
3、现在每个页面都能知道页面发生滚动了,并且也知道页面滚动的距离,我们要做的就是判断滚动的页面是否是当前页面,如果是我们就把滚动的值存到当前页面,下次显示的时候用scrollTo(value,value)
让它显示的时候正好停留在上次访问的地方。
scroll: function(scrollY) {
var cur_page = $.phonegap.pageManage.activityPage; // 组
if($.phonegap.pageManage.page(cur_page).isGroup) {
cur_page = $.phonegap.pageManage.page(cur_page).activityPage; //页面
}
if (cur_page == this.name) {
this.scroll_length = scrollY;
}
}
可能每个人的写法不一样的但是思想是差不多的。这就是我实现的所有代码。欢迎指出不足!
分享到:
相关推荐
支持121种过渡效果的JavaScript页面切换插件,是你的web页面更加丰富多彩,支持121种过渡效果的JavaScript页面切换插件,是你的web页面更加丰富多彩
javascript图片自动切换效果 javascript图片自动切换效果
采用JavaScript统计用户在网页的停留时间代码,简单易懂
主要为大家详细介绍了JavaScript实现tab栏切换效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
javascript 图片切换,自动切换,上下页转换。很实用,很适合网站使用。
pageSwitch.js是一款支持121种页面切换效果的javascript页面切换插件。pageSwitch插件适用场景为全屏切换,即一切一屏。它支持桌面和移动手机,支持多达121种切页效果,还支持自定义切页动画。
能实时切换语言!学习JAVASCRIPT和语言切换
Javascript—Tab切换
javascript注册页面代码(只包含用户名&密码&邮箱的验证)
javascript图片切换,可设置切换方式
利用javascript实现广告的动态切换效果
利用javascript制作的简单幻灯片切换
JavaScript实现层的切换 当鼠标移动到图层,左边的图片跟下边的图片改变
JavaScript实现页面动态验证码
NULL 博文链接:https://zhibin07.iteye.com/blog/1553974
javascript选项卡自动、手动切换可以兼容所有浏览器。自动切换可以给网页带来更好的效果。
javascript实现页面5秒后自动跳转到首页或其他页面
JavaScript图片切换展示效果
使用了JS技术以及JQuery技术完成轮播图特效实现