0

Webサイトで使用するスライドアウトCSSボックスがあり、Facebookのようなボックスをスライドするdivコンテナーに挿入すると、IE8では非常に散発的に動作します。

使用されるCSSコードは次のとおりです。

#sliding_box {
                position:absolute;
                width:425px;
                height:500px;
                background: url(./images/layout/facebook.png);

                top:200px;
                left:0px;               
                -moz-transition: all 0.5s ease-in-out;
                -webkit-transition: all 0.5s ease-in-out;
                -o-transition: all 0.5s ease-in-out;
                transition: all 0.5s ease-in-out;                 

                margin-left: -387px;      


            }                       

            #sliding_box:hover{

                margin-left: 0px;
            }

HTMLは次のとおりです。

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=2422861308";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
        <div id="sliding_box">
            <div class="fb-like-box" data-href="http://www.facebook.com/scopestop" data-

width="387" data-height="500" data-show-faces="true" data-border-color="gray" data-

stream="true" data-header="true"></div>
        </div>

likeボックスがロードされると、likeボックスにカーソルを合わせてもdivコンテナにカーソルを合わせているとは見なされないようです。同様のボックスが読み込まれ、空白のみが表示される前は、正しく動作しません。

JSFiddle: http: //jsfiddle.net/m4xg8/3/

フィドルは正常に機能しています。

ボックスをスライドさせるために、左マージンの代わりに絶対位置を使用しようとしましたが、Internet Explorer(8および9)で同じ問題が発生しました。

残念ながら、提案されているようにWebサイトの無効な文字を変更しても、問題は解決しませんでした。

Web開発の先生とPHPのインストラクターに助けを求めましたが、彼らには何もわかりませんでした。Facebookのようなボックスに精通していて、ホバーCSSコンテナの移動でそれを使用している人はいますか?

4

1 に答える 1

1

Web ページに無効な文字が含まれているようです:

スクリーンショット

于 2012-09-10T18:22:10.060 に答える