bas*_*abi 7 javascript jquery draggabilly
我正在使用来自tympanus的 ElastiStack js 插件和 requireJS。ElastiStack 依赖于Desandro 和 Modernizr 的Draggabilly。由于 tympanus 网站上包含的 Draggabilly js 是旧版本，因此我在 Desandro 网站上将其升级到最新版本（v1.2.4），现在支持 requireJS。
现在将它与 requireJS 一起使用，我得到了一个错误
ReferenceError：未定义 Draggabilly
this.draggie = new Draggabilly( this.items[ this.current ] );
您可以在此处查看示例（我只是为此将其托管在免费网络托管上，所以不要介意您会在那里看到的 php 错误。）
超文本标记语言
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/component.css" />
</head>
<body>
<ul id="elasticstack" class="elasticstack">
<li><img src="img/1.jpg" alt="01"/><h5>Saudade</h5></li>
<li><img src="img/2.jpg" alt="02"/><h5>Tuqburni</h5></li>
<li><img src="img/3.jpg" alt="03"/><h5>Retrouvailles</h5></li>
<li><img src="img/4.jpg" alt="04"/><h5>Onsra</h5></li>
<li><img src="img/5.jpg" alt="05"/><h5>Mamihlapinatapai</h5></li>
<li><img src="img/6.jpg" alt="06"/><h5>Koi No Yokan</h5></li>
</ul>
<script data-main="js/app" src="js/require.js"></script>
</body>
</html>
应用程序JS
requirejs.config({
'baseUrl': 'js', // Place all js core dependencies.
'paths': { // Path where this file is located
'draggabilly' : 'draggabilly.pkgd.min',
'modernizr' : 'modernizr.custom',
'elastistack' : 'elastiStack',
'main' : 'main',
},
'shim' : {
'elastistack' : {
deps: ['draggabilly', 'modernizr']
}
}
});
requirejs([
'elastistack',
'main'
]);
主要JS
define(['jquery'], function($) {
$(function() {
var asd = new ElastiStack($('#elasticstack')[0]);
});
});
| 归档时间： |
|
| 查看次数： |
746 次 |
| 最近记录： |