0

タッチ デバイスが含まれていない場合にのみ、fancybox を含めたいと思います。これまでの私のコードは次のとおりです。

<script>
    yepnope([{
        test : Modernizr.touch,
        nope  : './js/lib/fancybox/jquery.fancybox.pack.js',
        callback : {
            "jquery.fancybox.pack.js": function () {
                console.log("fancybox loaded!");
            }
        }
    }]);
</script>

このコードは、body の終了タグの前に配置されます。エラーTypeError: k.apply is not a functionが発生しますが、これは役に立ちません。

私の質問:

  • この相対パスで js ファイルをロードできますか?
  • 相対パスはどこから始まりますか? イェプノペのいる道から？
  • JS および CSS ファイルを条件付きで読み込むにはどうすればよいですか?

アップデート：

今、私は別の方法を試しました：

<script>
Modernizr.load([
    {
        test  : Modernizr.mq('screen and (max-width: 31.25em)'),
        yep  : {
            'photoswipe' : ['/js/klass.min.js', '/js/code.photoswipe-3.0.5.min.js']
        },
        nope : {
            'fancybox' : ['/js/lib/fancybox/jquery.fancybox.pack.js', '/js/lib/fancybox/jquery.fancybox.css']
        },
        callback : {
            'photoswipe': function (url, result, key) {
                var myPhotoSwipe = $("a.fancy").photoSwipe({ enableMouseWheel: false , enableKeyboard: false });
            },
            'fancybox': function (url, result, key) {
                $('a.fancy').fancybox();
            }
        }
    }
]);
</script>

次のエラーが表示されますTypeError: a.split is not a function。私が間違っていることは何ですか？

4

2 に答える 2

1

Q: この相対パスで js ファイルをロードできますか?

はい、次のような構造を持っている場合:

 index.html
--js/
----lib/
------modernizr.custom.js
--------fancybox/
----------jquery.fancyboxy.pack.js

これを説明するには、次の回答を参照してください...

Q: 相対パスはどこから始まりますか? イェプノペのいる道から？

Modernizr は、modernizr ロード スクリプトの位置からではなく、html ページの位置からパスを取得します (html でそのパスを使用してそのスクリプト参照を作成するため)。

Q: JS および CSS ファイルを条件付きで読み込むにはどうすればよいですか?

JavaScript だけの単一の文字列ではなく、配列を nope に渡します。

nope : ['./js/lib/fancybox/jquery.fancybox.pack.js', './styles/fancybox/jquery.fancybox.pack.css']

ドキュメントを見てください、彼らはこれについてかなり良いです... http://modernizr.com/docs/#load

于 2013-09-27T09:05:14.930 に答える
0

との相対パス./folderは可能です (/最初はありません)。また、配列でキーを使用することはできません。次に示すように、配列または個別のキーのいずれか:

<script>
    Modernizr.load({
        test: Modernizr.mq('screen and (max-width: 31.25em)'),
        yep: {
            'photoswipe-klass' : './js/klass.min.js',
            'photoswipe-js' : './js/code.photoswipe-3.0.5.min.js'
        },
        nope: {
            'fancybox-js' : './js/lib/fancybox/jquery.fancybox.pack.js',
            'fancybox-css' : './js/lib/fancybox/jquery.fancybox.css'
        },
        callback: {
            'photoswipe-js': function (url, result, key) {
                var myPhotoSwipe = $("a.fancy").photoSwipe({ enableMouseWheel: false , enableKeyboard: false });
            },
            'fancybox-js' : function (url, result, key) {
                $('a.fancy').fancybox();
            }
        }

    });
</script>
于 2013-09-27T13:39:15.007 に答える