1、强制让文档的宽度与设备的宽度保持1:1,并且文档最大的宽度比例是1.0,且不允许用户点击屏幕放大浏览;
<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
2、iphone设备中的safari私有meta标签,它表示:允许全屏模式浏览;
<meta content="yes" name="apple-mobile-web-app-capable" />
3、iphone的私有标签,它指定的iphone中safari顶端的状态条的样式;
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
4、告诉设备忽略将页面中的数字识别为电话号码
<meta content="telephone=no" name="format-detection" />
5、Android中禁止自动识别页面中的邮件地址,iOS中不会自动识别邮件地址;
<meta content="email=no" name="format-detection" />
6、渐变(这个在做按钮的时候很常用)
element{
background-image: -moz-linear-gradient(top, #2288cc, #389de2); /* Firefox */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #389de2), color-stop(1, #2288cc)); /* Saf4+, Chrome */
}
7、去掉手持设备点击时出现的透明层 (一般会在头部做格式化)
a,button,input{
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color: transparent; /* For some Androids */
}
8、当用户点击链接离开本页时,弹出一个消息框:
$(window).unload(function(){ alert("Goodbye!"); });
9、/*循环滚动*/
$("button").click(function(){
$("h3").eq(0).appendTo(‘p‘);
$("h3").eq(0).remove();
});
10、//js判断手机访问跳转到手机站 第一种方法
function browserRedirect() {
var sUserAgent= navigator.userAgent.toLowerCase();
var bIsIpad= sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs= sUserAgent.match(/iphone os/i) == "iphone os";
var bIsMidp= sUserAgent.match(/midp/i) == "midp";
var bIsUc7= sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsUc= sUserAgent.match(/ucweb/i) == "ucweb";
var bIsAndroid= sUserAgent.match(/android/i) == "android";
var bIsCE= sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM= sUserAgent.match(/windows mobile/i) == "windows mobile";
if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
window.location.href= ‘手机网站地址‘;
} else {
window.location= ‘电脑网站地址‘;
}
}
browserRedirect();
//js判断手机访问跳转到手机站 第二种方法
if(navigator.platform.indexOf(‘Win32‘)!=-1){
//pc
//window.location.href="电脑网址";
}else{
//shouji
window.location.href="手机网址";
}
$.parseJSON(response)用于把数据转换成JSON格式;
disabled(禁用)属性设定<input type="submit" disabled />在Js中设定,值为true and false;不用加双引号,作用是禁用某个元素,比如input submit会变成灰色无法点击。
如:document.getElementsByTagName(‘input‘)[0].disabled=true/false;
在Jquery中使用:$("#removeButton").removeAttr("disabled");//要变成Enable,JQuery只能这么写
$("#removeButton").attr("disabled","disabled");//再改成disabled
/*html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }此为全网页限制黑白色css代码*/
background:transparent;/*设置背景默认为透明*/
/*用css渐变滤镜实现背景渐变效果和透明效果*/
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=‘#cc090909‘,endColorstr=‘#cc090909‘)!important; /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=‘#cc0f0c0c‘,endColorstr=‘#cc0f0c0c‘)"!important; /* IE8 */
background-image: -moz-linear-gradient(rgba(0,0,0,0.8) 100%, rgba(0,0,0,0.8) 100%); /*firefox*/
background-image: -webkit-linear-gradient(rgba(0,0,0,0.8) 100%, rgba(0,0,0,0.8) 100%); /*chrome*/
/*判断浏览器是否支持 placeholder*/
$(function(){
if(!placeholderSupport()){ // 判断浏览器是否支持 placeholder
$(‘[placeholder]‘).focus(function() {
var input = $(this);
if (input.val() == input.attr(‘placeholder‘)) {
input.val(‘‘);
input.removeClass(‘placeholder‘);
}
}).blur(function() {
var input = $(this);
if (input.val() == ‘‘ || input.val() == input.attr(‘placeholder‘)) {
input.addClass(‘placeholder‘);
input.val(input.attr(‘placeholder‘));
input.css({‘color‘:‘#555‘});
}
}).blur();
};
})
function placeholderSupport() {
return ‘placeholder‘ in document.createElement(‘input‘);
}
/*获取浏览器的类型和名称*/
function isIE(){
return navigator.appName.indexOf(‘Microsoft Internet Explorer‘)=="-1"?false:true;
}//通过获取浏览器内核来判断浏览器的类型Netscape与Microsoft Internet Explorer---《用于区分火狐内核和IE内核的浏器》
var isIE8=navigator.userAgent.toUpperCase().indexOf("MSIE8.0")=="-1"?false:true;
//判断是否是IE8.0浏览器《这个用法通过获取浏览器的名字清楚的判断是哪种浏览器》用时,----indexOf对大小写敏感,没找到返回值 "-1" --------
/*
下面介绍下 js获取客户端浏览器信息
Navigator 对象包含有关浏览器的信息。js就是通过Navigator的属性获取客户端浏览器信息
Navigator 对象属性:
属性
描述
appCodeName 返回浏览器的代码名。
appMinorVersion 返回浏览器的次级版本。
appName 返回浏览器的名称。
appVersion 返回浏览器的平台和版本信息。
browserLanguage 返回当前浏览器的语言。
cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值。
cpuClass 返回浏览器系统的 CPU 等级。
onLine 返回指明系统是否处于脱机模式的布尔值。
platform 返回运行浏览器的操作系统平台。
systemLanguage 返回 OS 使用的默认语言。
userAgent 返回由客户机发送服务器的 user-agent 头部的值。
userLanguage 返回 OS 的自然语言设置。
*/