7

jQuery.cycleプラグインに問題があります。ページの最初のロード時（imgがキャッシュされていない場合）、サムネイルのような小さなimgが表示されます。あなたはそれを見ることができます（編集：申し訳ありませんが、古いリンク）-2番目の画像が表示されるのを待ってください-それは小さいです。リロード/リフレッシュはそれを解決しますが、それは本当の解決策ではありません。

誰かがこの問題の解決策を知っていますか？どうもありがとう

4

6 に答える 6

5

$(window).load(function() { });ではなく使用$(document).ready(function() { });

于 2012-04-11T09:36:36.217 に答える
5

overflow:hidden画像コンテナで使用DIV

于 2010-10-15T13:52:24.320 に答える
4

同じ問題。ランダムな画像は24pxx24pxのインラインスタイルになりました。各画像の高さと幅を設定するのではなく、CSSを使用して設定しました。私の幅は固定幅だったので、それを設定しましたが、高さを100％に設定しました。

.ParentDiv img { width: 400px !important; height: 100% !important; }

！importantは、jQueryサイクルによって適用されるインラインスタイルをオーバーライドするために必要です。

これは、私がIE8で抱えていた別の問題も解決したようです。ページは正常に読み込まれますが、すべてのCSSとjqueryが読み込まれた後に画像が読み込まれているように見えました。これにより、ボックスが画像の高さと幅に合わせて拡張されませんでした。幅と高さを設定すると、画像を保持するボックスのサイズがすぐにわかります。

于 2011-04-19T15:36:07.990 に答える
3

私は同じ問題を抱えていました、そしてそれは私を夢中にさせていました！画像をプリロードしたり、すべてのバージョンをチェックしたりしても無駄になりました。これを修正したと思われるのは、cssではなくページの各画像に幅と高さを設定することだけでした。

于 2010-01-30T06:49:48.620 に答える
0

<img>タグの幅と高さを設定することでこれを解決しました。しかし、私はスクリプトを使用して画像のリストを生成しており、画像にはさまざまなサイズがある場合があるため、これを解決するためにほんの少しのphpを使用しました。

function displayimage($filename) {
    $imgsize = getimagesize("$filename");
    echo "<img src=\"$filename\" $imgsize[3] />\n";
}

$imgsize[3]たとえば、width="585" height="285"です。

次に、スライドショーのディレクトリにあるすべてのjpgを表示するには：

<div class="slideshow">
<?php
foreach (glob("*.jpg") as $filename) {
    displayimage($filename);
}
?>
</div>

出力

<div class="slideshow">
<img src="cat.jpg" width="575" height="256" />
<img src="dog.jpg" width="475" height="350" />
<img src="frog.jpg" width="675" height="300" />
</div>
于 2014-09-13T15:19:08.653 に答える
0

質問に直接答えることはできないかもしれませんが（jQuery.cycleプラグインは私にはわかりません）、ここでの答えの多くは、ロード後の画像処理の問題に対処しており、それは人々がここに求めているものでもあります。だからここで何が起こっているのかがわかります：

24pxは、ブラウザ側のロジックに問題があるために発生します。プレースホルダーコントロールのサイズが時期尚早に返されます。キャッシュされた画像を処理するための異なる制御ロジックがあり、IEはそれらをトリガーすることすらありませんonload。そのため、すべての混乱が生じます。

(width===0)画像が読み込まれた場合にインターネット全体で検出されることを確認するよりも信頼性が高く、.completeすべての主要なブラウザでサポートされていると思われるDOMプロパティについてはほとんど言及されていません：http ：//www.w3schools.com/jsref/prop_img_complete.asp

これは私のために働いた：

$("img")
    .one('load', onLoadRoutine)
    .each(function() {
        if(!this.complete) {
            return; //.one() will fire eventually
        } else {
            onLoadRoutine({delegateTarget:this}); //fake event object
        }
    });

イベントモックアップオブジェクトに注意してください{delegateTarget:this}。望ましいjQuery(this).trigger('load')のですが、当時は試していなかったのでお勧めできません...

テストでは、.complete24pxプレースホルダーコントロールのロジックに障害がある場合を解決する必要があり.one('load').each()ます。キャッシュされた/離れた場所での制御フローの分割について説明します。

于 2017-07-30T08:23:43.057 に答える