title: Jquery conflict between two document ready functions
body: <p>Hi I have a website which uses a couple of different pieces of jquery, now individually they both work fine on the page, but when you add them both one stops working.  Below are the two pieces of code that i believe are conflicting,</p>
  
  <p>Is it because they both use </p>
  
  <pre><code>  $(document).ready(function(){
  </code></pre>
  
  <p>Below are the two pieces of code.</p>
  
  <pre><code>    jQuery(document).ready(function() {
                  jQuery('#example2').showbizpro({
                      dragAndScroll:"off",
                      visibleElementsArray:[5,4,3,1],
                      carousel:"on",
                      heightOffsetBottom:10,
                      mediaMaxHeight:[150,150,150,150],
                      rewindFromEnd:"off",
                      autoPlay:"off",
                      delay:2000,
                      speed:750
                  });
  
                  // THE FANCYBOX PLUGIN INITALISATION
                  jQuery(".fancybox").fancybox();
  
              });
  </code></pre>
  
  <p>And the second piece of code is </p>
  
  <pre><code>    $(document).ready(function(){
              $('#layerslider').layerSlider({
                  skinsPath : 'skins/',
                  skin : 'borderlessdark3d',
                  thumbnailNavigation : 'hover'
              });
          });
  </code></pre>
  
  <p>Any suggestions would be much appreciated as i anew to Jquery so any advice would be a help.  Thanks</p>