0

<img>タグを含むコンテナ要素があります。画像の幅は 100%、高さはauto. コンテナのオーバーフローは に設定されてhiddenおり、 と もmax-heightありmin-heightます。アイデアは、最大ブレークポイントと最小ブレークポイント内で、イメージによってコンテナーの高さを決定することです。

したがって、コンテナには相対的な高さがあります。流動的なトランジションを実現するために、resizeイベントの高さをリセットします (複雑な理由により、img高さ自体は設定されず、計算されてから JavaScript で変更されます)。これは正常に機能し、ウィンドウのサイズを変更すると、すべて正常に機能します。

しかし、サイズ変更イベントにあるいくつかのロジックは、ロード イベントでも実行したいと考えています。したがって、次のように、ロード内でサイズ変更を呼び出すだけだと思いました。

$(window).load(function(){
    $(window).resize();
});

しかし、これはうまくいきませんでした。このコードでは、1 ピクセルでも手動でウィンドウのサイズを変更すると、含まれている要素が適切にスケーリングされます (200pxロード時に計算された高さと、リセットされ、適切にスケーリングされた高さとの差についてです)。

どうやら、これがどのように機能するかについての私の理解は間違っています。このように前に他のイベントを呼び出して、イベントを発生させて別の何かをトリガーしました。どうすればやりたいことを達成できますか?

4

3 に答える 3

1

ウィンドウのサイズを変更することで実際に何が達成されているのかまだ疑問に思っていますが、トリガーresizeする別の方法は次のとおりです。

$(window).load(function() {
    $(this).trigger('resize');
});
于 2013-10-11T16:06:39.217 に答える
0

何が問題だったのかわかりません。resizeアプローチを変更し、イベントを呼び出す必要のない別のソリューションを見つけましたload。

于 2013-10-14T13:52:39.957 に答える