开发:篮球战术演练工具

最近公司篮球队约赛,输了两场。输球不要紧,得总结。所以自己开发了一款【篮球攻防演练工具】。

整理了一些常用的联防站位,和一些适合我们球队的高位挡拆战术。

1) CSS3 设计球场,比例:1m = 60px
2)jquery + jquery UI 完成交互设计
3)画板功能等有空再继续写吧。

DEMO:http://www.hiheng.com/demo/hibkball/

jQuery 1.9版本的变化

项目终于面临jquery 版本升级问题了,又要开始读各种文档,写各种demo。话说也很久没静下心来写码了。

.toggle(function, function, … ) 方法移除
toggle() 方法: 用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件。
在 jQuery 1.9 版本中该方法被移除,未提供替换方法。

$.browser() 方法移除
在 jQuery 1.9 版本中该方法被移除,需要另写插件来完成。

.live() 方法移除
.live()方法:为被选元素附加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。
在 jQuery 1.9 版本该方法被移除,升级后的方法用 “.on()” 来替换。

.die() 方法移除
.die() 方法:移除所有通过 live() 方法向指定元素添加的一个或多个事件处理程序。
在 jQuery 1.9 版本中“.live()”方法被移除,因此该方法也一样被删除。 由“.off()”来替代。

.sub() 方法移除
.sub方法: 可创建一个新的jQuery副本,不影响原有的jQuery对像。
在 jQuery 1.9 版本该方法被移除。


ajax事件需要绑定到document上
如.addBack()、 .addStart(),需要绑定在document。

jQuery官方文档:http://jquery.com/upgrade-guide/1.9/

如何判断微信浏览器?

最近围绕微信工作平台的需求越来越多,所以就需要判断访问者是否为微信浏览器。

PHP方法:利用PHP的“_SERVER ”数组“HTTP_USER_AGENT”项,获取该页面的用户代理的信息,来完成这个工作。

<?php
echo $_SERVER["HTTP_USER_AGENT"];
?>

【winows/chrome】 输出结果:

weixin

Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.69 Safari/537.36

而【ios7/weixin】下输出结果:

viewfile

Mozilla/5.0 (iPhone; CPU iPhone OS 7_0_4 like Mac OS X) AppleWebKit/537.51.1 (KHTML, like Gecko) Mobile/11B554a MicroMessenger/5.0.3

在字符串中可以看出“MicroMessenger ”为微信浏览器版本,所以可以使用“MicroMessenger”参数,来判断访问来源是否为“微信浏览器”。

if(strpos($_SERVER['HTTP_USER_AGENT'],"MicroMessenger "))
{
	echo "Hello Weixin";
}

Javascript方法:

function isweixin(){
    var ua = navigator.userAgent.toLowerCase();
    if(ua.match(/MicroMessenger/i)=="micromessenger") {
        return true;
    } else {
        return false;
    }
}

javascript判断手机/平板电脑浏览器

判断用户是否是移动设备(手机浏览器、平板电脑)浏览器的方法:

if(/AppleWebKit.*mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){
    if(window.location.href.indexOf("?mobile")<0){
        try{
          if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
               // window.location.href="http://m.guzheng.cn/";
            }else if(/iPad/i.test(navigator.userAgent)){
              window.location.href="http://www.guzheng.cn/";
            }else{
              //window.location.href="http://m.guzheng.cn/";
            }
        }catch(e)
		{

		}
    }
}
else
{
 //window.location.href="http://www.guzheng.cn/";
}

JQuery插件,可以看到全局的古筝缩略图

记录一下之前关于网页中古筝缩略图的一些思考,和最终写出的一个JQuery插件。
网站的缩略图以古筝为主,古筝是一件形状较长的乐器。在网页上一般会用古筝的尾部作为缩略图(古筝尾部的工艺设计比较有代表性)。如图:

继续阅读JQuery插件,可以看到全局的古筝缩略图

使用jquery插来操作cookie —— JQuery.cookie.js

JQuery.cookie.js 常用方法:

1、新建并设置cookie的值

//
/* 新建并设置cookie的值 */
$.cookie("hiheng";, "www.hiheng.com");
//

2、读取Cookie值

//
/* 读取Cookie值, 输出"www.hiheng.com" */
$.cookie("hiheng"); 
//

3、设置cookie的有效期,expires属性

//
/* 设置cookie的有效期一周。 */
$.cookie("hiheng", "www.hiheng.com",{expires: 7}); 
//

4、设置cookie的域名范围,domain属性

//
/* 设置cookie的域名范围,hiheng.com */
$.cookie("hiheng", "www.hiheng.com", {domain: "hiheng.com"});
//

5、设置cookie的有效路径,path属性

//
/* 新建一个cookie 包括有效期 路径 域名等 */
$.cookie("hiheng", "www.hiheng.com", {path: "/"});
//

6、综合设置cookie的各种属性

//
/* 新建一个cookie 包括有效期 路径 域名等 */
$.cookie("hiheng", "www.hiheng.com", {expires: 7, path: "/", domain: "hiheng.com", secure: true});
//

7、删除一个cookie

//
/* 删除一个name为”hiheng“的cookie */
$.cookie("hiheng", null); 
//

jquery.cookie.js源码,下载

jQuery.cookie = function(name, value, options) {
    if (typeof value != 'undefined') { 
        options = options || {};    
        if (value === null) {
            value = '';
            options.expires = -1;   
        }
        var expires = '';
        if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
            var date;
            if (typeof options.expires == 'number') {
                date = new Date();
                date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
            } else {
                date = options.expires;
            }
            expires = '; expires=' + date.toUTCString();
        }
        var path = options.path ? '; path=' + (options.path) : '';
        var domain = options.domain ? '; domain=' + (options.domain) : '';
        var secure = options.secure ? '; secure' : '';
        document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
    } else { 
        var cookieValue = null;
        if (document.cookie && document.cookie != '') {
            var cookies = document.cookie.split(';');
            for (var i = 0; i < cookies.length; i++) {
                var cookie = jQuery.trim(cookies[i]);
                if (cookie.substring(0, name.length + 1) == (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }
};