Category: Javascript /Jquery / React / Bootstrap / Web
直接看代码：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>
<script type='text/javascript' src="http://maps.google.com/maps/api/js?sensor=false&.js"></script>
<script type='text/javascr…
Read More
1. 通过经纬度，计算直线距离
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&libraries=geometry"></script>
<script>
var p1 = new google.maps.LatLng(45.463688, 9.18814);
var p2 = new google.maps.LatLng(46.0438317, 9.75936230000002);
//calculates distance between two points in km'…
Read More
Javascript版:
//:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
//:::
什么是 Cookie？
Cookie 是您访问过的网站创建的文件，用于存储浏览信息，例如您的网站偏好设置或个人资料信息。共有两种类型的 Cookie：第一方 Cookie 是由地址栏中列出的网站域设置的 Cookie，而第三方 Cookie 来自在网页上嵌入广告或图片等项的其他域来源。
Cookie可以用来提升用户体验，比如网站可以使用Cookie来记录用户的登录状态，用户只要登录一次就可以不用登录了，购物网站通过Cookie来保存购物车中的商品等。同时很多的网站分析都是依靠Cookie来完成的。
以网站统计为例，目前主要的统计方式是日志记录法和页面标记法。一般日志记录法细化到IP，而页面标记法细化到U…
Read More
前一阵子，我们发现高版本的Safari中默认会阻止第三方cookie，如下图所示。
问题
什么是第三方cookie呢？在访问一个网站A时，网站A算作第一方，如果网站A中引用了另一个网站X（网站X的域名与网站A的域名不同）的资源， 这时这个网站X就被认为是第三方。需要注意的是，这儿区分不同网站的标准是域名是否相同，而不是这两个网站是否由同一个公司运营。比 如，taobao.com和tmall.com被认为是两个网站，尽管它们都属于阿里集团。
在网站建设中，使用第三方资源非常常见，大多数据情况下，这并不会带来问题。不过有时候，我们可能希望能读写这个第三方域下的cookie，这时问题就…
Read More
有时候我们在前端开发工作中为了获取图片的信息，需要在图片加载完成后才可以正确的获取到图片的大小尺寸，并且执行相应的回调函数使图片产生某种显示效果。本文主要整理了几种常见的javascipt判断图片加载完成时的方法，并通过代码与实际应用相结合进行解释与说明。
onload方法
通过向img标签添加onload属性，并填入相应的函数来执行后续的javascipt代码。如下代码例子中img元素默认是不显示的，通过onload判断加载完成后再将图片显示出来。
<img class="pic1" onload="get(this)" src="..." style='display:none' />
<…
Read More
ajax.php 代码：
$address = $_GET['address'];
$xml = file_get_contents('https://maps-api-ssl.google.com/maps/api/geocode/xml?address='.urlencode($address).'&sensor=false');
$arr = xml2array($xml);
$output = $arr['GeocodeResponse']['status'];
主要是利用了谷歌接口：https://maps-api-ssl.google.com/maps/api/geocode/xml?address=…
Read More
我们在一些微博网站上可以碰到这样的应用，微博内容列表没有使用分页条，而是一次加载一定数量的记录显示在列表页，当用户浏览到列表页底部时，可以通过单击“查看更多”来加载更多记录。本文我将结合jQuery和PHP给大家讲述如何实现这种应用。
查看演示 下载源码
基本原理：页面载入时，jQuery向后台请求数据，PHP通过查询数据库将最新的几条记录显示在列表页，在列表页的底部有 个“更多”链接，通过触发该链接，向服务端发送Ajax请求，后台PHP程序得到请求参数，并作出相应，获取数据库相应的记录并以JSON的形式返回给前 台页面，前台页面jQuery解析JSON数据，并将数据追加到列表页。其实就是Ajax分页效…
Read More
我们浏览有些网页的时候，当拉动浏览器的滚动条时到页底时，页面会继续自动加载更多内容供用户浏览。这种技术我暂且称它为滚屏加载技术。我们发现很多网站用到这种技术，必应图片搜索、新浪微博、QQ空间等将该技术应用得淋漓尽致。
查看演示
滚屏加载技术，就是使用Javascript监视滚动条的位置，每次当滚动条到达浏览器窗口底部时，触发一个Ajax请求后 台PHP程序，返回相应的数据，并将返回的数据追加到页面底部，从而实现了动态加载，其实就是一个典型的Ajax应用。本文将使用jQuery，结合 PHP，mysql以及JSON，为您讲解如何应用滚屏加载技术到您的项目中去。当然，阅读本文的前提是您需要有jQuery和…
Read More
jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery 插件，它使用非常简单，生成的 QRcode 无需下载图片，并且不依赖第三方服务，比如最近 Google 服务在国内访问不稳就造成我好几个网站的 QRcode 不能使用，并且压缩之后大小小于 4K。
jquery.qrcode.js 使用
1. 加载 jQuery 和 jquery.qrcode.js：
<script type='text/javascript' src='http://cdn.staticfile.org/jquery/2.1.1/jquery.min.js'></script>
<script type="…
Read More
二维码是桌面和移动端快速分享的高效手段之一，这里介绍两个不错的快速开发二维码的方法，和大家分享一下~~
方法1：使用新浪提供的服务
这种方式简单快速，在服务端生成一个二维码的图片，兼容性比较好，你无需自己处理任何相关二维码的生成，只需要提供一端文字或者url即可，方法如下：
<img src="http://qrcoder.sinaapp.com?t=http://www.gbtags.com">
生成效果如下：
大家扫一扫就可以访问极客标签主站了~~
方法2： 使用jQuery插件qrcode
QRcode是一个jQuery插件，可以使用javascript快速帮助你生成相关的二维码
相关代码如…
Read More
在线演示 下载
WebRTC可能是明年最受关注的HTML5标准了，Mozilla为此开发了一套帮助你控制硬件的API，例如，摄像头，麦克风，或者是加速表。你可以不依赖其它的插件来调用你需要的本机硬件设备。
在今天的这篇文章中，我们将介绍来自Wolfram Hempel开发的Photobooth.js，使用这个类库可以帮助你快速的调用摄像头功能，你可以很容易的添加摄像头功能到网站中。并且快速的帮助你拍照，你可以使用这个功能来实现用户的大头照拍摄，是不是非常不错？
主要特性：
对比度设置
颜色设置
亮度设置
色调设置
拍照按钮
支持最新的chrome, firefox, opera等浏览器
支持jQuery插件方式和jav…
Read More
官网：http://www.schillmania.com/projects/soundmanager2/
HTML5 标准中加入了两个非常强大的标签 audio 和 video ，让我们在网页中嵌入视频和音频变得非常方便，但是不幸的是目前用户所使用的有很大一部分浏览器都是老版本的，并不支持这两个标签，这使前端开发者们很困扰，这里介绍一款相对来讲支持浏览器比较多的网页音频播放器 —— SoundManager 2。
以下是 SoundManager 2 支持的浏览器版本，你没看错，它甚至支持 IE5：
Firefox (all versions), Windows/Mac
Safari 1.3+ (Mac) / A…
Read More
流量劫持，这种古老的攻击沉寂了一段时间后，最近又开始闹的沸沸扬扬。众多知名品牌的路由器相继爆出存在安全漏洞，引来国内媒体纷纷报道。只要用户没改默认密码，打开一个网页甚至帖子，路由器配置就会被暗中修改。互联网一夜间变得岌岌可危。
攻击还是那几种攻击，报道仍是那千篇一律的砖家提醒，以至于大家都麻木了。早已见惯运营商的各种劫持，频繁的广告弹窗，大家也无可奈何。这么多年也没出现过什么损失，也就睁只眼闭只眼。
事实上，仅仅被运营商劫持算是比较幸运了。相比隐匿在暗中的神秘黑客，运营商作为公众企业还是得守法的，广告劫持虽无节操但还是有底线的。这不，能 让你看见广告了，也算是在提醒你，当前网…
Read More
