0

私はこのプラグインを使用していますが、成功しています：

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

ユーザーが767pxより小さい画面を表示している場合、つまり、画像自体にリンクし、ライトボックスを上げない場合、JSを無効にする方法があるかどうか疑問に思っていました。私は同様の質問をすべて調べましたが、それらの解決策はどれも実際には機能していません。また、それらを実装する方法もわかりません。

役立つ場合は、Modernizrをダウンロードして使用できます...？

4

2 に答える 2

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があり、頼ることができます。

幸運を！

于 2013-02-15T23:54:38.267 に答える