Colorbox and RoyalSlider conflicting

Vote count:

0

I'm using Jack Moore's Colorbox jQuery plug-in to have images show up in a lightbox on one part of my page. I've also got RoyalSlider (jQuery) showing images in a slideshow on another part of my page.

My problem is that I can't run both at the same time. They run perfectly when separate but are conflicting once together.

Any help would be great, here are the bits of my HTML:

In my head I've got:

<script>
$(document).ready(function(){
                $(".inline").colorbox({inline:true});
            });
</script> 

<!-- ROYAL SLIDER --> 
<script class="rs-file" src="royalslider/royalslider/jquery-1.8.3.min.js"></script>
<script class="rs-file" src="royalslider/royalslider/jquery.royalslider.min.js"></script>
<link class="rs-file" href="royalslider/royalslider/royalslider.css" rel="stylesheet">
<link class="rs-file" href="royalslider/templates/assets/royalslider/skins/default/rs-default.css" rel="stylesheet">

<!-- COLORBOX -->
        <link rel="stylesheet" href="ocean_dog_files/colorbox/example5/colorbox.css" />
        <script src="http://ift.tt/17YXcKA"></script>
        <script src="ocean_dog_files/colorbox/jquery.colorbox.js"></script>

and then at the bottom of my body tag I've got:

<script>jQuery(document).ready(function($) {
  $('#gallery-1').royalSlider({
    controlNavigation: 'thumbnails',
    autoScaleSlider: true, 
    autoScaleSliderWidth: 500,     
    autoScaleSliderHeight: 425,
    loop: false,
    imageScaleMode: 'none',
    imageAlignCenter: false,
    navigateByClick: true,
    numImagesToPreload:2,
    arrowsNav:true,
    arrowsNavAutoHide: true,
    arrowsNavHideOnTouch: true,
    keyboardNavEnabled: true,
    fadeinLoadedSlide: true,
    globalCaption: true,
    globalCaptionInside: true,
    thumbs: {
      appendSpan: true,
      firstMargin: true,
      paddingBottom: 4
    }
  });
});
</script>

If I link RoyalSliders' JS scripts and CSS pages before those for Colorbox, only Colorbox will work, and vice versa. I'd like to know how to have them both work properly! I hope my question makes sense. Any help would be great, thanks!

asked 31 secs ago

Matt

1

Colorbox and RoyalSlider conflicting