天天看点

bootstrap input file在火狐浏览器中不美观

使用bootstrap 遇到的问题

(1)上传文件控件在火狐中显示不美观

bootstrap input file在火狐浏览器中不美观

 以下是期望的效果:

bootstrap input file在火狐浏览器中不美观

解决办法:

在页面的onload事件里面判断浏览器的类型,若是火狐浏览器,则修改样式:

bootstrap input file在火狐浏览器中不美观

 <script type="text/javascript">  

        //适配file 在火狐中不美观的问题  

        var fileinputadapt=function(inputfile222){//style="padding-top: 0px; border: none;box-shadow:none"  

            var brow=$.browser;  

            if(brow.mozilla){//firefox  

                inputfile222.style.border='none';  

                inputfile222.style.boxshadow='none';  

                inputfile222.style.paddingtop='0px';  

            }  

        };  

 window.onload=function(){  

  fileinputadapt(com.whuang.hsj.$$id('exampleinputfile'));  

}  

 </script>  

 最后在火狐浏览器中的效果:

bootstrap input file在火狐浏览器中不美观

(2)下拉框在ie 中不美观

bootstrap input file在火狐浏览器中不美观

 解决方法:

bootstrap input file在火狐浏览器中不美观

//解决每页多少条的下拉框在ie中不美观的问题  

       var brow=$.browser;  

       if(brow.msie){  

           com.whuang.hsj.$$id('select22id').style.paddingright='0';  

       }  

 最后的效果:

bootstrap input file在火狐浏览器中不美观

(3)boostrap 导航在ie8中不兼容

在ie8中的界面:

进入页面时

bootstrap input file在火狐浏览器中不美观

 展开和收起过程中,出现黑色背景:

bootstrap input file在火狐浏览器中不美观
bootstrap input file在火狐浏览器中不美观

 解决导航栏背景是黑色:

在head中添加

bootstrap input file在火狐浏览器中不美观

<!--[if ie 8 ]>  <link rel="stylesheet" href="css/ie8_yunma.css"> <![endif]-->  

 ie8_yunma.css的内容:

bootstrap input file在火狐浏览器中不美观

a {  

    background-color:white;  

 注意:只有在ie8中才会引用 ie8_yunma.css

解决边框是黑色的问题,现象如下:

bootstrap input file在火狐浏览器中不美观

在</body> 标签的后面添加:

bootstrap input file在火狐浏览器中不美观

 <!--[if ie 8 ]>  

<script >  

    var ie8_ok=function(){//当浏览器是ie8才执行  

        var brow=$.browser;  

        if(brow.msie){  

            $('ul.secondnavigate').css('border-bottom-color','#ddd');//导航菜单边框是透明的  

            $('ul.secondnavigate').css('border-left-color','#ddd');//导航菜单边框是透明的  

        }};  

</script>  

    <![endif]-->  

 同时在window.onload方法中添加:

bootstrap input file在火狐浏览器中不美观

var brow=$.browser;  

      if(brow.msie && ie8_ok && ie8_ok!=undefined){//当浏览器是ie,并且ie版本是8才执行  

          ie8_ok();  

      }  

解决展开和收起时背景有黑色的问题:

bootstrap input file在火狐浏览器中不美观
bootstrap input file在火狐浏览器中不美观