Jquery Resize Resolution Vice Versa

當您運行此代碼（請參閱鏈接）並且WIDTH大於600像素時，鏈接將變爲綠色且可點擊。如果您使用MIDDLE欄將分辨率降低到小於600像素，則鏈接將變爲紅色，鏈接將被禁用。這很好！Jquery Resize Resolution Vice Versa

的問題是，如果你最初運行的代碼時，屏幕比600px的小，代碼將變成紅色，是的，但如果你使用中等條提高分辨率，鏈接將不轉回到GREEN 。我試圖讓jquery以適當的分辨率運行。

（我在尋找一個簡單的插件，這樣無需較大的庫）

DEMO：http://jsfiddle.net/Fe4vG/3/

我在做什麼不對的，所以我可以jquery適當運行在任何一個分辨率？

var eventFired = 0; 

if ($(window).width() > 600) { 
    $('a').css("color", "green"); 
} 
else { 
    $('a').click(false); 
    $('a').css("color", "red"); 
    eventFired = 1; 
} 

$(window).on('resize', function() { 
    if (!eventFired) { 
     if ($(window).width() > 600) { //larger than 600 res 
      $('a').unbind('click'); //enable click 
      $('a').css("color", "green"); //change to green 
     } else { //smaller than 600 res 
      $('a').click(function() {return false;});//disable click 
      $('a').css("color", "red"); //change to red 
     } 
    } 
});

來源

2013-11-25 Evan

只要刪除任何引用eventFired的東西。你不需要這個。

DEMO

//var eventFired = 0; 

if ($(window).width() > 600) { 
    $('a').css("color", "green"); 
} 
else { 
    $('a').click(false); 
    $('a').css("color", "red"); 
    //eventFired = 1; 
} 

$(window).on('resize', function() { 
    //if (!eventFired) { 
     if ($(window).width() > 600) { //larger than 600 res 
      $('a').unbind('click'); //enable click 
      $('a').css("color", "green"); //change to red 
     } else { //smaller than 600 res 
      $('a').click(function() {return false;});//disable click 
      $('a').css("color", "red"); //change to green 
     } 
    //} 
});

來源

2013-11-25 18:28:33 kei

我很欣賞你的觀察。謝謝！希望這也能幫助別人。 – Evan

當您最初運行的代碼，eventFired設置爲1。事件處理程序（!eventFired）內的條件永遠不會成立，所以不會發生任何操作。

來源

2013-11-25 18:24:24

Jquery Resize Resolution Vice Versa

回答

相關問題