-1

写真の高さが 450px を超える場合、ページ上のすべての画像を「.photo」のクラスで取得し、「.vertical」のクラスを記事に適用する方法はありますか? 私がこれを行っている理由は、背の高い写真の幅を狭くしたいためです。したがって、クラス .vertical を追加して、記事のスタイルを設定し、通常の幅の 500px ではなく 250px にします...

基本的に、写真の 500px バージョンがページに表示され、500px の写真の高さが 450px を超える場合、その記事にクラス .vertical を追加して、記事全体のサイズを変更する必要があります。

ややこしいように聞こえますが、一度理解したわけではありません。私はこれに慣れていないので、コードは高く評価されていますが、何をすべきかわかりません。

4

5 に答える 5

4

はいあります。

まず画像の高さを取得します。javascriptを使用して画像サイズ(高さと幅)を取得するには?

.addClass()高さが要件を満たしている場合は、クラスを追加するために使用します。

于 2012-09-11T01:06:17.540 に答える
0

試す：

$('img.photo').each(function(){
    if($(this).height() > 450)
        $(this).closest('article').addClass('vertical');
});

親記事にクラスを追加するために更新されました。必要に応じてセレクターarticleを変更します。

于 2012-09-11T01:08:21.957 に答える
0

これを試して：

$(".photo").each(function(){
  var el = $(this);
  if (el.height() > 450)
    el.addClass("vertical");
});
于 2012-09-11T01:08:29.897 に答える
0

何かのようなもの：

$(".photo").each(function(i) { 
  if ($(i).height() >450) {
     $(i).addClass('yourclass');
  }
});
于 2012-09-11T01:09:05.210 に答える
0

うまくいけば、これで始めることができます：

$('img.photo').each(function(index) {
    var height = $(this).height();
    if (height > 450) {
        $(this).parent().addClass('vertical');
    }
});

編集：

画像を含む記事に .vertical クラスを追加することに関しては、マークアップによって異なります。@anonymous は、.article のクラスで最も近い要素を見つけることで、考えられるアイデアを 1 つ思いつきました。直接の親が画像を含む記事である場合、上記の編集済みコードのように親を使用することもできます。

于 2012-09-11T01:09:49.297 に答える