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

I've 开发者_运维百科recently started playing around with jQuery (I have no JavaScript experience BTW) and I'm having a little trouble getting jQuery effects to play nicely together.

Any help would be greatly appreciated.

<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>

$$ is not correct and you did not close your .ready and .box is not the classname of your div and neither is container.

This works for me: 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
   });
});