案例描述

body很长，可以滑动，body头部有一个模拟下拉的选择框。下拉选择有滚动轴，如下图。

问题描述

头部是一个普通的div，高度是48,头部下面有个固定的banner，手下滑的时候，banner会固定在浏览器最顶部不动。出现的问题是，PC端是好的，手机浏览器向上滑动的时候出现闪动！影响用户体验。

之前的做法

 if ($(window).scrollTop() < 48) {
                $(".nav ").css("top", 48 - parseInt($(window).scrollTop()));
            }else{
              $(".nav ").css("top", "0");  
            }
        $(window).scroll(function () {
            $(".nav ").css("top", "0");
            var toplength = parseInt($(window).scrollTop());
            if ($(window).scrollTop() < 48) {
                $(".nav ").css("top", 48 - toplength);
            }
 });

html5中的GPS定位功能主要用的是getCurrentPosition， 该方法封装在 navigator.geolocation 属性里，是 navigator.geolocation 对象的方法。

getCurrentPosition()函数简介

getCurrentPosition(successCallback,errorCallback,positionOptions)

successCallback

表示调用getCurrentPosition函数成功以后的回调函数，该函数带有一个参数，对象字面量格式，表示获取到的用户位置数据。该对象包含两个属性 coords 和 timestamp。其中 coords 属性包含以下7个值：

关于手机网站的图片加载，canvas方法加载图片，占用内存最小，效果最佳，关于canvas图片加载，我之前的一篇文章中提几个。具体请看手机网站几点注意的问题。当然，这些都是很久之前整理的，有些地方写的可能有点问题，例如zeptiojs了等等。

一、canvas图片加载

关于canvas加载，我的方法是，将文章中所有用到图片的地方，都用canvas代替，给canvas一个data-src，里面存放img的路径，通过canvas方法渲染图片。因为图片渲染需要时间，一般会给canvas一个背景，背景可以用gif图片。图片渲染好了之后把背景去掉。