2016年05月的文章

HTML5利用Geolocation API获取地理位置定位功能

定位功能(Geolocation)是html5的新特性,因此只有在支持HTML5的现代浏览器上运行,特别是手持设备如iphone,地理定位更加精确。首先我们要检测用户设备浏览器是否支持地理定位,如果支持则获取地理信息。注意这个特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的,所以我们在访问该应用时会提示是否允许地理定位,我们当然选择允许即可。


function getLocation(){ 
    if (navigator.geolocation){ 
        navigator.geolocation.getCurrentPosition(showPosition,showError); 
    }else{ 
        alert("浏览器不支持地理定位。"); 
    } 
} 


» 阅读全文

关键词: 定位 , 获取地理位置 , html5

砸金蛋:PHP+jQuery实现的砸金蛋中奖功能

砸金蛋:PHP+jQuery实现的砸金蛋中奖功能。当然案例是3个,你也可以改为1个金蛋,进行抽奖

1.png - 大小: 75.65 KB - 尺寸: 1124 x 688 - 点击打开新窗口浏览全图

抽奖算法:



» 阅读全文

关键词: 砸金蛋

刮刮卡:利用HTML5的画布Canvas的实现移动端刮刮卡效果

我们利用HTML5的画布canvas,结合其提供的API,在Canvas元素上绘制一个灰色蒙层,然后通过检测用户鼠标移到和手势来绘制一个透明的图形,这样就能看到Canvas背景下的真实图片,就达到刮刮卡效果。
HTML
我们只需要在页面中加入canvas标签元素,其他的就看javascript的了。注意canvas元素是HTML5才有的元素,运行在支持HTML5的现代浏览器上,特别是移动。

1.png - 大小: 40.87 KB - 尺寸: 966 x 542 - 点击打开新窗口浏览全图

DEMO:


http://www.jincon.com/download/guaguaka/

» 阅读全文

关键词: canvas , 刮刮卡

PHP+jQuery实现的大转盘抽奖程序

PHP+jQuery实现的大转盘抽奖程序

1.png - 大小: 137.97 KB - 尺寸: 1122 x 876 - 点击打开新窗口浏览全图

演示地址:

http://www.jincon.com/download/lottery/

抽奖算法部分:

» 阅读全文