JQuery + IE问题

时间:2011-09-21 05:22:45

标签: jquery internet-explorer cross-browser

我构建this website严重依赖于JQuery,并且遇到了IE的问题。

单击此图标时:

enter image description here

有一个自定义灯箱下来并加载一个持有表单的iframe。它在Chrome / FF中工作正常,但在IE中它表示存在错误:

enter image description here

我故意使用非缩小版的JQuery来计算出哪些代码行似乎是:

fx.elem.style[ fx.prop ] = (fx.prop === "width" || fx.prop === "height" ? Math.max(0, fx.now) : fx.now) + fx.unit;

此外,这是我写的用于创建灯箱效果的内容:

function popup(url, width, height)
{
    var shell = $('<div id="popup-shell"></div>');
    shell.append('<div style="margin-top: -' + height + 'px; width: ' + width + 'px; height: ' + height + 'px;" id="popup-inner"></div>');

    var inner = shell.find("div#popup-inner");

    var cb = $('<a style="margin-left: ' + Number(width - 26) + 'px;" id="popup-close"></a>');

    inner.append(cb);
    inner.append('<iframe width="' + width + '" height="' + height + '" src="' + url + '" scrolling="no" frameborder="0"></iframe>');

    cb.click(function()
    {
        shell.stop().animate({height: "0%"}, 700, 0, function()
        {
            shell.remove();
        });
    });

    shell.animate({height: "100%"}, 700, 0, function()
    {
        inner.animate({marginTop: "120px"}, 700);
    });

    $("body").append(shell);
}

如果这是一个已知问题,任何建议或解决方案都会很棒。

1 个答案:

答案 0 :(得分:1)

首先将shell对象附加到body

$("body").append(shell);

然后添加动画脚本

shell.animate({height: "100%"}, 700, 0, function()
    {
        inner.animate({marginTop: "120px"}, 700);
    });

那应该可以解决你的问题。我在IE控制台模式下测试了它并且它有效