0

嗨，我为背景图像设置了动画。在 Firefox 中它工作正常，但在 IE 上它给了我错误$(header.css(...) is null or not an object)。这是我的代码

var $header = $(".overlayBox");
$header.css("backgroundPosition", "0 0");

var bgScroll = function() {

    **var current = parseInt($header.css("backgroundPosition").split(" ")[1]),   //This is the line that IE is mentioning**      
    newBgPos = "0 " + (current - 1) + "px";
    //Finally we set the new background-position using jQuery's css() method.
    $header.css("backgroundPosition", newBgPos);

} //end of bgScroll()

setInterval(function() { bgScroll() }, 75);

为什么它在 IE 中不起作用？我也在使用覆盖。在 Firefox 中，当我单击覆盖时，覆盖消失。但是在 IE 上，当我点击覆盖时，什么也没有发生。这是这个的代码

// close it when closeLink is clicked
$('a.closeLink').click( doOverlayClose );    

function doOverlayOpen() {

    //set status to open
    isOpen = true;
    showOverlayBox();
    ...
    addEvents();

    // dont follow the link : so return false.
    return false;

} //end of doOverlayOpen()

function doOverlayClose() {

    //set status to closed
    isOpen = false;
    var test = $(".overlayBox");
    $('.overlayBox').css( 'display', 'none' );   

    $('.bgCover').animate({         //This is not working in IE
        opacity:0
    }, null, null, function() {
        $(this).hide();
    });

} //end of doOverlayClose()

function addEvents() {     //Now working in IE

    //Click out event!
    $(".bgCover").click(function(){
        doOverlayClose();
    });

    //Press Escape event!
    $(document).keypress(function(event){

        // IF Esc key press and popup is visible
        if (event.keyCode==27 && isOpen==true) {
            doOverlayClose();
        }
    }) ;

} //end of addEvents()

我还在我的 div 中添加了关闭链接，例如

<div class="bgCover">&nbsp;</div>
<div class="overlayBox" style="background-image: url(../images/header.jpg)" >

    <div class="overlayContent">

        <a href="javascript:void()" class="closeLink">Close</a>
        ....

    </div>

</div>

当我在 IE 中单击关闭链接时，该$('.overlayBox').css( 'display', 'none' );行工作但 bgcover 仍然存在，意味着$('.bgCover').animate({})行不工作。为什么这在 IE 中不起作用:(。请帮忙。谢谢

4

2 回答 2

0

这可能是 hide() 的问题，您可以尝试使用：


$('.bgCover').animate({         //This is not working in IE
        opacity:0
    }, null, null, function() {        
          $(this).attr("style", "display: none"); 
    });

希望有帮助

于 2012-04-05T06:25:27.890 回答
0

修复背景位置

if ($.browser.msie) {

        current = parseInt($header.css("backgroundPositionY"));

} else {

        current = parseInt($header.css("backgroundPosition").split(" ")[1]);

}

覆盖修复

showOverlayBox();

if ($.browser.msie) {

    $('.bgCover').css("opacity", 0.5);

} else {

    $('.bgCover').css({

        opacity:0

    }).animate( {

        opacity:0.5,
        backgroundColor:'#000'

    }); //end of animate

}

然后代码开始似乎在两种浏览器上都有效。我不知道 doOverlayOpen() 方法中的 animate() 在代码上创建了什么效果，因此事件以及 bgCover 并没有消失。好吧，这段代码至少对我有用。谢谢

于 2012-04-05T08:07:17.877 回答