0

私のjqueryで何が問題になっていますか? 画面サイズに応じて div を大きくしたいのですが、良い例はたくさんありますが、まだ成功していません。

  var screenWidth = screen.width;
  if (screenWidth < 1024) {

      $(".gadgetblockLeft1").css("width","40%");
  }  else {
        $(".gadgetblockLeft1").css("width","100%");
  }

そしてCSSはまだ:-

.gadget .gadgetblockLeft1 { padding:5px; background-color:#f4f4f4; border:1px solid #cfcfcf; font-family:Tahoma, Geneva, sans-serif; font-size:12px; text-align:right; direction:rtl; margin-left:5px; height:auto; float:left}

画面を900pxまたは900px未満に変更するときに、このコードwidth:100%をクラスに追加する必要があります.gadgetblockLeft1

4

2 に答える 2

1

おそらくメディア クエリを使用する必要があります。

.gadgetblockLeft1 { width: 40%; }
@media (min-width: 1024px) { .gadgetblockLeft1 { width: 100%; } }

このアプローチには、ウィンドウのサイズ変更などにより画面幅が変更されたときに、自動的に適切なサイズ変更が行われるという利点があります。

于 2013-05-12T16:13:57.530 に答える
0

これを試して:

 $(window).resize(function() {         
    if ($(window).width() <= 900) {
       $(".gadget .gadgetblockLeft1").css("width","100%");
    }
    });
于 2013-05-12T16:08:05.397 に答える