屏幕寬度大於480時禁用jquery功能

Question

我是新手（不開玩笑嗎？！），我無法使它正常工作。 我在這里做錯了什么？ 如果屏幕寬度大於480，我不希望此功能執行任何操作，僅在屏幕寬度為480及以下時才觸發。

if ( screen.availWidth < 480 ) {

 $(document).ready(function(){
 $(".reklam").click(function(){
 $('.reklam').attr('src','bilder/480/reklam_on.jpg');

  });
});

}

Answer 1

因為屏幕大小可以更改（如果用戶重新調整窗口大小），那么在事件中包含if語句是否更有意義？

參見示例：

$(document).ready(function(){
    $(".reklam").click(function(){
        if ($(window).width() < 480) {
            $('.reklam').attr('src','bilder/480/reklam_on.jpg');
        }
    });
});

Answer 2

我將直接在函數內部檢查screen width 1，如下所示：

$(".reklam").click(function(){
  var screenWidth = screen.width;
  if (screenWidth <= 480) {
      $('.reklam').attr('src','bilder/480/reklam_on.jpg');
  }  else {
       alert('Screen width too high!');
  }
 });

Answer 3

$(document).ready(function(){
 $(".reklam").click(function(event){
     if ( screen.availWidth < 480 ) {
         $('.reklam').attr('src','bilder/480/reklam_on.jpg');
    }
    else {
         event.stopPropagation();
         return false;
    }
 });
});

或類似的東西。

Answer 4

     var winWidth = 0; 
    $(window).resize(function() {
     winWidth = $(document).width();
    });

在你的函數中寫

if(winWidth >480)
{
  $(".reklam").click(function(){
 $('.reklam').attr('src','bilder/480/reklam_on.jpg');
});

}

要么

$(document).ready(function(){
    $(".reklam").click(function(){
        if ($(window).width() < 480) {
            $('.reklam').attr('src','bilder/480/reklam_on.jpg');
        }
    });
});