0

私のウェブサイトにシンプルに実装しようとしJQuery Fadein/Fadeoutています。だから私はこれらの手順を実行しました

Jクエリ

<script type="text/javascript">
    $(document).ready(function() {          
    $(".writereview").click(function(){

        $(".reviewpopup").fadeIn();
        $(".popupcontainer").fadeIn();

    });


    $(".popupclose").click(function(){

        $(".reviewpopup").fadeOut();
        $(".popupcontainer").fadeOut();

    });

    });

    </script>

HTML

   <div class="reviewpopup" style="display: none; "></div>
   <div class="popupcontainer" style="display: none; ">
   <iframe src="feedback.html" frameborder="0" scrolling="no" width="475" height="510">               </iframe>
    <a href="#" class="popupclose"><img src="images/popupclose.jpg" alt="HoHo"></a> </div>

CSS

.reviewpopup {

    display:none;
    width:100%;
    height:100%;
    overflow:hidden;
    background-color:#000;
    opacity:0.5;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 
    filter: alpha(opacity=50);              
    position:fixed;
    top:0;
    z-index:1001;   
        }

        .popupcontainer {
    width: auto;
    height:auto;
    display:none;
    position:absolute;
    top: 45px;
    left: 50%;
    margin-left: -280px;
    background-color:#FFF;
    z-index:1001;
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border:solid 5px #000;
    padding:20px;
         }

JQueryはすべてのブラウザで正常に動作していますが、問題はOpacity is not working properly in IE8. Jqueryを削除しただけで動作します。このIE8 Opacity と Jqueryの正確な理由はわかりません。私を助けてください。

4

1 に答える 1

2

fadeIn()CSSfilter値をオーバーライドするためfadeIn、部分不透明要素を呼び出すときは、コールバックで値をリセットする必要があります。

var pop = $('.reviewpopup'),
    filter = pop.css('filter'); // fadeIn overrides filter value in IE8; reset it
pop.fadeIn(function() {
    if (filter) pop.css('filter', filter);
});
于 2012-10-15T19:04:46.400 に答える