zoukankan      html  css  js  c++  java
  • jquery.jconfirm兼容IE6

    因目标用户还在大量使用IE6(想吐CAO),只能做向下兼容,但之前使用的这个插件在IE6上并不支持。所以做了些处理才行。

    以下为解决方法:

    IE6不支持position: fixed,所以需要对CSS进行HACK

    修改如下:

    .jconfirm {
        position: fixed;
        /*hack ie6*/
        _position: absolute;
        _display: block;
        _width: 100%;
    
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 99999999;
        font-family: inherit;
        overflow: hidden;
    }
    
        .jconfirm .jconfirm-bg {
            position: fixed;
             /*hack ie6*/
           _position: absolute;
            _display: block;
            _width: 100%;
    
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            opacity: 0;
            filter: alpha(opacity:0);
            -webkit-transition: all .4s;
            transition: all .4s;
        }
    
            .jconfirm .jconfirm-bg.seen {
                opacity: 1;
                filter: alpha(opacity:100);
            }
    
        .jconfirm .jconfirm-scrollpane {
            position: fixed;
            /*hack ie6*/
             _position: absolute;
            _display: block;
            _width: 100%;
    
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            overflow-y: auto;
        }

    另外,样式中,所有opacity:x,都添加一行filter: alpha(opacity:y);其中的值y=x*100;

    然后JS也需要做些更改,需要计算高度。

            setBKHeight: function () {
                if ($.browser.msie && $.browser.version < 8) {
                    var windowHeight = $(window).height();
                    $(".jconfirm").height(windowHeight);
                    $(".jconfirm-bg").height(windowHeight);
                    $(".jconfirm-scrollpane").height(windowHeight);
                }
            },

    在resize事件中添加计算高度

    $(window).on('resize.' + this._rand, function () {
                    that.setDialogCenter(true);
                    that.setBKHeight();
                });

    _buildHTML中也需要添加调用:

                if (this.closeIcon === true) {
                    this.$closeButton = this.$b.find('.closeIcon').show();
                }

                this.setContent();
                this.setBKHeight();

    这样就可以了。

    http://files.cnblogs.com/files/dengxi/jquery.jconfirm.7z
    嫌麻烦的,可以直接下载.

  • 相关阅读:
    Iconfont——实现字体图标的反转
    HTTPS——https下的静态资源中如何使用http的地址
    TP5.x——initialize()中如何return
    vscode——tab转空格
    Chocolatey——windows下的包管理器
    head里两个重要标签base和meta
    js原生触发事件
    路径分隔符不一致,导致windows下不能开发
    HTML词法和语法
    chrome headless 无头浏览器 应用
  • 原文地址:https://www.cnblogs.com/dengxi/p/7196458.html
Copyright © 2011-2022 走看看