让jQuery插件相互协作(特别是Jrumble和Masonry)

Getting jQuery plugins to work with one another (Specifically Jrumble and Masonry)

本文关键字:Jrumble 特别是 Masonry 协作 jQuery 插件      更新时间:2023-09-26

我最近开始玩jQuery(我没有JavaScript经验,BTW)我在让jQuery效果很好地配合使用时遇到了一些小麻烦。

如有任何帮助,我们将不胜感激。

<div class="demo-box" id="demo"><h1>hello</h1></div>
<script src="../jquery-1.6.1.min.js"></script>
<script src="../jquery.masonry.min.js"></script>
<script type="text/javascript" src="js/jrumble.1.1.min.js"></script>
<script>
   $$(function(){
     $$('#container').masonry({
       itemSelector: '.box',
       columnWidth: 100
     });
   });
 $(document).ready(function(){
        $('#demo').jrumble({
                 rangeX: 0,
                 rangeY: 0,
                 rangeRot: 5
         });
 </script>

$$不正确,您没有关闭您的.ready和.box不是div的类名,也不是容器。

这对我有效:http://jsfiddle.net/mplungjan/hqNdm/

<div id="container">
    <div class="demo-box" id="demo1"><h1>Hello</h1></div>
    <div class="demo-box" id="demo2"><h1>There</h1></div>
</div>    
$(document).ready(function(){
     $('#container').masonry({
       itemSelector: '.demo-box',
       columnWidth: 500
     });

   $('#demo1').jrumble({
     rangeX: 0,
     rangeY: 0,
     rangeRot: 5
   });
});