美文网首页
关于移动端兼容性1 模态框出现页面滚动

关于移动端兼容性1 模态框出现页面滚动

作者: 郑宋君 | 来源:发表于2019-03-14 09:47 被阅读0次
    let bodyEl = document.body
    let top = 0
    
    function stopBodyScroll (isFixed) {
      if (isFixed) {
        top = window.scrollY
    
        bodyEl.style.position = 'fixed'
        bodyEl.style.top = -top + 'px'
      } else {
        bodyEl.style.position = ''
        bodyEl.style.top = ''
    
        window.scrollTo(0, top) // 回到原先的top
      }
    }
    

    禁止用户双击放大

    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    

    取消input 按钮的初始样式

    input[type=button],input[type=submit],input{
        -webkit-appearance:none;
        outline:none;
        border-radius:0;
    }
    

    点击取消背景色

    *{
      -webkit-tap-highlight-color:rgba(0,0,0,0);
    }
    
    

    输入框只允许输入数字

    尽量少输入数字,最好不要使用Input,鼠标移开时修改内容到正确数字
    

    返回上一页

    
        var index = 'http://www.shop2.com/'
    
        jQuery('i.icon-xiangxia').on('click',function(){
            if (typeof document.referrer === '') {
                //返回首页
                window.location.href =  index
            }else{
                //返回上一页
                window.location.href =  document.referrer
            }
        })
    

    相关文章

      网友评论

          本文标题:关于移动端兼容性1 模态框出现页面滚动

          本文链接:https://www.haomeiwen.com/subject/gjxzpqtx.html