在較小的決議禁止的fancybox

Question

我使用這個插件，成功：

http://www.fancyapps.com/fancybox/

我只是想知道是否有任何方式在所有我能禁用JS，如果用戶是在屏幕小於767像素 - 也就是說，只是鏈接到圖像本身，而不是提高燈箱？我瀏覽了所有類似的問題，但他們的解決方案都沒有真正起作用，我也不知道如何實現它們。

我可以下載並使用Modernizr，如果它會幫助...？

Answer 1

我不確定您必須支持哪些瀏覽器，但可以使用'window.matchMedia'。你可以在這裏找到支持的瀏覽器：http://caniuse.com/matchmedia。

至於你會如何使用它，你的情況：

if (window.matchMedia("(min-width: 767px)").matches) { 
    // Initialize fancyBox. 
} 

我沒有看到任何地方，你就必須處理轉變到畫面的大小，但如果你這樣做，你可以添加聽衆像這樣：

var mediaQuery = window.matchMedia("(min-width: 767px)"); 
mediaQuery.addListener(handleWidthChanges); 
handleWidthChanges(mediaQuery); 

function handleWidthChanges(mediaQuery) { 
    if (mediaQuery.match) { 
     // Do nothing if fancyBox already initialized otherwise disable. 
    } else { 
     // Disable fancyBox if it's initialized otherwise do nothing. 
    } 
} 

如果您有支持比其他瀏覽器目前支持「window.matchMedia」，Modernizr的有這樣：http://modernizr.com/docs/#mq，你可以依靠。

祝你好運！