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 に答える