前些日子为大家倾囊为大家分享了一些有关移动端的结构与标签的相关介绍,今天将继续为大家介绍的则是一个小小的功能,那就是移动端IOS系统收缩地址导航栏功能。
JavaScript代码
// 它只有一个参数,该参数表示被调用的函数名(在页面加载完毕时执行的函数的名字)
function addLoadEvent(func) {
var oldOnload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
}
else {
window.onload = function() {
oldOnload();
func();
}
}
}
// 添加Load事件处理
addLoadEvent(hideMenu);
function hideMenu() {
setTimeout("window.scrollTo(0, 0)", 1);
}
//以上代码是针对IOS系统的移动端收缩地址导航栏作用的(部分安卓机也可以)。核心代码其实就是一句:
//setTimeout("window.scrollTo(0, 0)", 1);意思是说将坐标移到(0,0)点在0.001秒后执行
//利用定时器,将窗口移动到内容端的最上端。从而隐掉地址导航栏。
上面的代码原理虽然没有用到HTML5的小知识,但是我认为还是和移动端有关,所以也在这里讲了。以上便是有关HTML5实战与剖析之移动端IOS系统收缩地址导航栏功能的介绍,大家以后再遇到这样的需求的时候还是会比较方便的拿来就能用了。