移动端笔记

   
//禁止复制,选中文本
Element {
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
     user-select: none;
}


//长时间按页面闪退
element {
    -webkit-touch-callout: none;
}


//iphone下输入框默认内阴影
Element{
    -webkit-appearance: none;
}


//旋转屏幕时字体大小问题

*{
   -webkit-text-size-adjust:100%; 
}


//设置缓存
    <meta http-equiv="Cache-Control" content="no-cache" />
  不希使用缓存可以设置no-cache。


//桌面图标问题
    <link rel="apple-touch-icon" href="touch-icon-iphone.png" />
    <link rel="apple-touch-icon" sizes="76x76" href="touch-icon-ipad.png" />
    <link rel="apple-touch-icon" sizes="120x120" href="touch-icon-iphone-retina.png" />
    <link rel="apple-touch-icon" sizes="152x152" href="touch-icon-ipad-retina.png" />


<input type="text" id="testInput">
<script type="text/javascri [/color]pt">
    document.getElementById(‘testInput‘).addEventListener(‘input‘, function(e){
        var value = e.target.value;
    });
</script>


[color=darkblue]
//浏览器私有及其它meta

    QQ浏览器私有
        全屏模式    <meta name="x5-fullscreen" content="true">
        强制竖屏    <meta name="x5-orientation" content="portrait">
        强制横屏    <meta name="x5-orientation" content="landscape">
        应用模式    <meta name="x5-page-mode" content="app">
    UC浏览器私有
        全屏模式    <meta name="full-screen" content="yes">
        强制竖屏    <meta name="screen-orientation" content="portrait">
        强制横屏    <meta name="screen-orientation" content="landscape">
        应用模式    <meta name="browsermode" content="application">


//移动端背景无法固定

在移动端制作固定背景时(利用fixed)会出现滚动条滚动时,背景图会跟着滚动,下面的方案可以解决这个问题:
body:before {
  content: ' ';
  position: fixed;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: url(...) center 0 no-repeat;
  background-size: cover;
}


//border-radius
border-radius设置为奇数时,在pc上是圆的,在手机上是不圆的,所以在制作的时候,将border-radius制作成偶数值。
//圆的
width:8px;
height:8px;
border-radius:50%;

//不圆的
width:9px;
height:9px;
border-radius:50%;

//IOS中input键盘事件keyup、keydown、keypress支持不是很好

    问题是这样的,用input search做模糊搜索的时候,在键盘里面输入关键词,会通过ajax后台查询,然后返回数据,然后再对返回的数据进行关键词标红。用input监听键盘keyup事件,在安卓手机浏览器中是可以的,但是在ios手机浏览器中变红很慢,用输入法输入之后,并未立刻相应keyup事件,只有在通过删除之后才能相应!
    解决方法:可以用html5的oninput事件去代替keyup[/size][/size]


错误联系邮箱:[email protected]

猜你喜欢

转载自201611292510.iteye.com/blog/2377123