[TOC] ###2016-05学习笔记 ####1.eavl()函数可计算某个字符串，并执行其中的的 JavaScript 代码 当返回参数需要当成JS代码来执行的时候可以使用该函数。 ####2.纯数字在div层里无法自动换行 解决方案：在div层样式加入 ``` word-wrap:break-word; word-break:break-all; ``` ####3.arguments属性 ``` $.preloadSound = function () { //arguments批量获取所有函数传递内容成数组对象 for (var i = 0; i < arguments.length; i++) { $('<audio>').attr('src', arguments[i]); } }; $.preloadSound(1,2,3,4,5,6) ``` ####4去掉a标签的虚线框 ``` a{blr:expression(this.onFocus=this.blur())} /*去掉a标签的虚线框，避免出现奇怪的选中区域*/ ``` ####5当元素获得焦点的时候，焦点框为0 ``` :focus{outline:0;} ``` ####6移动端自适应字体大小切换 ~~~ !(function (doc, win) { var el = doc.documentElement; //resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'; function setSize() { var w = el.clientWidth; if (!w) return; w=w>480?480:w; w=w<320?320:w; el.style.fontSize = (100 * (w / 1080)).toFixed(3) + 'px'; } if (!doc.addEventListener) return; setSize(); win.addEventListener('resize', setSize, false); win.addEventListener('pageshow', function(e) { if (e.persisted) { setSize(); } }, false); })(document, window); ~~~ ####css移动端字体代码 ~~~ html{font-size:10px} @media screen and (min-width:321px) and (max-width:375px){html{font-size:11px}} @media screen and (min-width:376px) and (max-width:414px){html{font-size:12px}} @media screen and (min-width:415px) and (max-width:639px){html{font-size:15px}} @media screen and (min-width:640px) and (max-width:719px){html{font-size:20px}} @media screen and (min-width:720px) and (max-width:749px){html{font-size:22.5px}} @media screen and (min-width:750px) and (max-width:799px){html{font-size:23.5px}} @media screen and (min-width:800px){html{font-size:25px}} ~~~ ####移动端预设透明度 ~~~ .opa2 { opacity: .2; -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity = 20); filter: alpha(opacity = 20); -moz-opacity: .2; -khtml-opacity: .2; } .opa3 { opacity: .3; -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity = 30); filter: alpha(opacity = 30); -moz-opacity: .3; -khtml-opacity: .3; } .opa4 { opacity: .4; -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity = 40); filter: alpha(opacity = 40); -moz-opacity: .4; -khtml-opacity: .4; } .opa5 { opacity: .5; -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity = 50); filter: alpha(opacity = 50); -moz-opacity: .5; -khtml-opacity: .5; } .opa6 { opacity: .6; -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity = 60); filter: alpha(opacity = 60); -moz-opacity: .6; -khtml-opacity: .6; } .opa7 { opacity: .7; -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity = 70); filter: alpha(opacity = 70); -moz-opacity: .7; -khtml-opacity: .7; } .opa8 { opacity: .8; -ms-filter: progid: DXImageTransform.Microsoft.Alpha(Opacity = 80); filter: alpha(opacity = 80); -moz-opacity: .8; -khtml-opacity: .8; } ~~~ ####去除a/button/input标签被点击时产生的边框 ~~~ a,button,textarea,select{ -webkit-appearance:none; -webkit-tap-highlight-color:rgba(255,0,0,0); } /* 1.去除android a/button/input标签被点击时产生的边框 2.去除ios a标签被点击时产生的半透明灰色背景 */ ~~~ ###2016-06学习笔记