1

I'm using single-page-nav to have an 'animated' menu and Photoswipe for a photo gallery. The problem is I'm not able to have both work together. Now, if I have:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="js/simple-inheritance.min.js"></script>
<script type="text/javascript" src="js/code-photoswipe-jQuery-1.0.15.min.js"></script>
<script src="js/jquery.singlePageNav.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){           
        $("#gallery a").photoSwipe();   
    });     
</script>

I've Photoswipe working, but not singlePageNav.. While doing:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="js/simple-inheritance.min.js"></script>
<script type="text/javascript" src="js/code-photoswipe-jQuery-1.0.15.min.js"></script>
<script src="js/jquery.singlePageNav.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){           
        $("#gallery a").photoSwipe();   
    });     
</script>

I've singlePageNav working, but not Photoswipe. Tried with jQuery 1.11.1, but none of them working.. I've see that: Can I use multiple versions of jQuery on the same page? So I try:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
    var jQuery_1_6_1 = $.noConflict(true);
</script>
<script type="text/javascript">
    $(document).ready(function(){           
        jQuery_1_6_1("#gallery a").photoSwipe();    
    });     
</script>
<script type="text/javascript" src="js/simple-inheritance.min.js"></script>
<script type="text/javascript" src="js/code-photoswipe-jQuery-1.0.15.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    var jQuery_1_7_1 = $.noConflict(true);
</script>
<script src="js/jquery.singlePageNav.min.js"></script>

but still no luck, none of them working.. Something else that I colud try, before looking for an alternative to Photoswipe?

Community
  • 1
  • 1
MisterFrank
  • 177
  • 1
  • 4
  • 21
  • 1
    First off, it's just not a good idea to try to use multiple version of jQuery in the same page. You should research what the support jQuery versions are for each jQuery plug-in you're using and try to find some common ground between the two so you can use just one jQuery version. That is the most desirable solution. I would not recommend guess and test. I would recommend research to find out what combinations are supported. – jfriend00 Nov 25 '14 at 23:27
  • I tried, but going on Photoswipe site I didn't find that information. Instead I found "The call (if using jQuery)", that suggest that it can be used also without jQuery, like document.addEventListener('DOMContentLoaded', function(){ Code.photoSwipe('a', '#Gallery'); }, false); but I could not make it work in that way. I was looking for an alternative, when I see the StackOverflow link for multiple version, and even if I don't like too the idea, I would give it a shot.. – MisterFrank Nov 25 '14 at 23:38
  • 1
    There is a separate non-jQuery version of PhotoSwipe (a separate version of PhotoSwipe). I would suggest you use that one to solve your issue. It also looks like the jQuery version of PhotoSwipe is built for jQuery mobile. – jfriend00 Nov 25 '14 at 23:42
  • Thank you! I didn't notice it, tommorow I'm going to try! – MisterFrank Nov 26 '14 at 00:00
  • Also, you can prevent jQuery from claiming the `$` global, and then call it using `jQuery("#gallery a").photoSwipe();` instead of `$("#gallery a").photoSwipe(); `. – GolezTrol Nov 26 '14 at 00:50
  • Working with non-jQuery version! Tried with jQuery instead of $ (already tried with custom jQuery_1_6_1 $.noConflict variable) but not working, probably I'm doing something wrong.. non-jQuery version is ok to me, and I agree with better using one jQuery version. – MisterFrank Nov 26 '14 at 09:05

0 Answers0