jQuery：基於瀏覽器窗口大小禁用和啓用插件？

我有下面的代碼來添加一個函數，取決於瀏覽器的大小，但如果瀏覽器調整大小，我該如何刪除這個插件的影響？（目前，它只有在頁面是在特定的大小裝工作，而不是它是否調整）jQuery：基於瀏覽器窗口大小禁用和啓用插件？

$(document).ready(function(){ 
    $(window).resize(function() { 
     if ($(window).width() >= 420) { 
      // Enable the plugin to make the tab functionality... 
      $("#tabs").tabs(); 
     } 
     else { 
     // Code needed to completely disable the tab functionality?? 
     } 
    }); 
});

來源

2013-04-08 CodeyMonkey

我normaly創建插件腳本，一個DIV內具有特定ID，所以當我婉要清除，只需刪除ID和SCRIPT將與他一起去。

在你的情況..

$(document).ready(function(){ 
    $(window).resize(function() { 
     if ($(window).width() >= 420) { 
      // Enable the plugin to make the tab functionality... 
      var tempScript = '<div id="newTempId"><script type="text/javascript" src="../js/plugInScript.js"></script></div>'; 
      $('body').append(tempScript); // append the DIV with the PlugIn script inside 
      $("#tabs").tabs(); 
     } 
     else { 
     // Code needed to completely disable the tab functionality?? 
     $("#tabs").tabs({ disabled: [ 0, 2 ] }); // see API info at http://api.jqueryui.com/tabs/#option-disabled 
     $('newTempId').remove(); // Remove the DIV that include the script 
     } 
    }); 
});

或/和......包括響應CSS文件，根據窗口大小。

<link href="../css/responsive_style.css" rel="stylesheet" type="text/css" media="screen and (min-width:419px)" />

希望它能幫助，祝你好運

來源

2013-04-08 11:30:41 gmo

嗨，因此，與您的解決方案，這是否隱藏標籤內容或者只是刪除腳本？ - 由於我仍然需要刪除腳本時顯示的內容。 – CodeyMonkey 2013-04-09 06:51:56

在我的示例中，將從'DOM'中刪除'＃newTempId' div中的所有內容，只有腳本和他的功能。（除非你把標籤內容放在裏面）。如果您想給我們一個實例，我們可以嘗試根據您的需求進行調整。 – gmo 2013-04-09 10:59:02

如果你正在使用jQuery UI選項卡插件（我猜的話）：

var $win = $(window), 
    $tabs = $("#tabs"); 

$win.resize(function() { 
    if ($win.width() >= 420 && !$tabs.is('.tabbed') { 
     // Enable the plugin to make the tab functionality... 
     $tabs.tabs().addClass('tabbed').removeClass('destroyed'); 
    } else if(!$tabs.is('.destroyed')) { 
     // remove plugin functionality and add class 
     // so we don't try to execute this on every resize 
     $tabs.tabs('destroy').addClass('destroyed').removeClass('tabbed'); 
    } 
});

來源

2013-04-08 11:40:11 Simon

嗨， - 我沒有使用jQuery UI，我很害怕:(我不認爲你有一個通用的解決方案出於興趣嗎？讓我知道你是否需要任何東西:) - 我實際上使用這個 - http://os.alfajango.com/easytabs/ – CodeyMonkey 2013-04-09 06:52:50

但是這個插件是不是用'.easytabs（）'而不是'.tabs（）'初始化？在easytabs的頁面上找不到任何名爲'.tabs（）'的演示... – Simon 2013-04-09 07:46:00

jQuery：基於瀏覽器窗口大小禁用和啓用插件？

回答

相關問題