3

bxSlider を使用しようとしていますが、IE8 が連携しないようです。この例では、画像スライダーが折りたたまれているか、まったく表示されていません...開発者ツールをオンにしてデバッグすると、スライダーが突然表示され、すべてがぎこちなく見えるため、わかりにくいです。

http://www.ilium.com/test/

デバッグコンソールをオンにすることで解決された(別のスライドショープラグインでの)javascriptエラーがあったという別の同様の質問がありました:

ie8/9 開発者ツールでのみ動作する jQuery スクリプト

...しかし、私の場合、IEはエラーをスローしていないようで、提案された修正は私の状況では機能しませんでした/適用されませんでした。さらに、スクリプトのどこにも console.log がないと思います。ページの読み込み時にコンソールをアクティブにするスクリプトをいくつでも追加しようとしましたが、役に立ちませんでした。

JQueryの競合を解決することを目的とした修正を試みました(リンクするのに十分な担当者がまだいない別のサイトで提案されています)。bxSlider関数呼び出しを次のように変更します。

    <script>// <![CDATA[
    $jQ = jQuery.noConflict();
    $jQ('#home').live('pageshow',function(){
    $jQ('.bxslider').bxSlider({
    mode: 'fade',
    auto: true,
    pager: false,
    controls:true,
    pause: 9000,
    });
    });
    // ]]>
    </script>

ダメで、他のすべての競合を引き起こし始めました。

GitHub の問題 ( https://github.com/wandoledzep/bxslider-4/issues/197 ) では、IE が bxSlider で LI を折りたたんでいると述べられており、LI に幅を持たせるためにいくつかの CSS を追加することを提案しました。これも私にはうまくいきませんでした。

そのため、数時間経った今、この問題についてはまったくわかりません。何か提案はありますか?

4

4 に答える 4

0

面白い私は今晩同じ問題に遭遇しました - 私のシナリオでは、bx-wrapper に固定の高さを設定することができたので....

.bx-wrapper{
   height: 500px !important;
}

私のために修正しました-柔軟であると期待しているので理想的ではありませんが、ここでは機能しました。

私はスクリプトをデバッグしようとしましたが、 resizeWindow->redrawSlider ハンドラーに絞り込んでみましたが、それがディスプレイ自体を正しくする原因です(特に開発者ツールではなく、それらを開いたときに発生するウィンドウのサイズ変更イベント)-時間外ですが、明日、より良い解決策をお知らせします。

于 2013-10-15T05:24:20.510 に答える
0

私はサイトで同じ問題を抱えていました。それを修正するためにブラウザのサイズを変更する代わりに(これも私にとってはうまくいきました。それは開発者ツールを開くことが本質的に行っていることです)、画像をリロードするためのコードを少し追加しました(キャッシュからではなく)IE8で毎回、各画像の最後に任意のクエリを追加します。これは私にとってはうまくいくようでした。下記参照。

<div class="slide"><img src="images/your_image_name.jpg<?php if (strstr($_SERVER['HTTP_USER_AGENT'], "MSIE 8") > ""){ echo "?v=" .  time(); } ?>" ></div>
于 2014-04-14T14:17:13.517 に答える
0

同じ問題がありました。私にとっての解決策は、スライドする画像のサイズをパーセンテージではなく、正確なピクセル数でサイズ変更することでした。例えば、

<li><img src="image.jpg" style="width: 561px; height: 425px;" /></li>

それ以外の

<li><img src="image.jpg" style="width: 170%; height: 170%;" /></li>

次に、ブートストラップの img-responsive クラスを追加して、画像を再びレスポンシブにします。

于 2014-01-22T13:30:22.560 に答える