Uncaught Typeerror: $ (...) lightGallery ist keine Funktion

Question

wenn ich versuche, den Link zu klicken, um es diese Konsole im Browser zeigt.

Uncaught TypeError: $(...).lightGallery is not a function(anonymous function) @ index.html:250dispatch @ jquery.min.js:3r.handle @ jquery.min.js:3 

und das ist der Code, den ich verwendet:

$('#gallery').on('click', function() { 
    $(this).lightGallery({ 
     dynamic: true, 
     dynamicEl: [{ 
      "src": 'assets/images/gallery/1.jpg', 
      'thumb': 'assets/images/gallery/thumbs/1.jpg', 
      'subHtml': '<h4>Fading Light</h4><p>Classic view from Rigwood Jetty on Coniston Water an old archive shot similar to an old post but a little later on.</p>' 
     }, { 
      'src': 'assets/images/gallery/2.jpg', 
      'thumb': 'assets/images/gallery/thumbs/2.jpg', 
      'subHtml': "<h4>Bowness Bay</h4><p>A beautiful Sunrise this morning taken En-route to Keswick not one as planned but I'm extremely happy I was passing the right place at the right time....</p>" 
     }, { 
      'src': 'assets/images/gallery/3.jpg', 
      'thumb': 'assets/images/gallery/thumbs/3.jpg', 
      'subHtml': "<h4>Coniston Calmness</h4><p>Beautiful morning</p>" 
     }] 
    }) 
}); 

bedenke ich verwende den Dynamic Mode in der lightGallery.

1. Ich habe bereits die lightGallery-Bibliothek und die jQuery-Bibliothek davor enthalten.
2. Ich habe versucht, die $ mit jQuery zu ersetzen.
3. Ich versuchte auch die "Semikolon-Lösung", aber ohne Glück.

das ist die ganzen Bibliotheken i enthalten:

<script src="assets/web/assets/jquery/jquery.min.js"></script> 
    <script src="assets/tether/tether.min.js"></script> 
    <script src="assets/bootstrap/js/bootstrap.min.js"></script> 
    <script src="assets/smooth-scroll/SmoothScroll.js"></script> 
    <script src="assets/viewportChecker/jquery.viewportchecker.js"></script> 
    <script src="assets/cookies-alert-plugin/cookies-alert-core.js"></script> 
    <script src="assets/cookies-alert-plugin/cookies-alert-script.js"></script> 
    <script src="assets/dropdown/js/script.min.js"></script> 
    <script src="assets/touchSwipe/jquery.touchSwipe.min.js"></script> 
    <script src="assets/jarallax/jarallax.js"></script> 
    <script src="assets/bootstrap-carousel-swipe/bootstrap-carousel-swipe.js"></script> 
    <script src="assets/jquery-mb-ytplayer/jquery.mb.YTPlayer.min.js"></script> 
    <script src="assets/theme/js/script.js"></script> 
    <script src="assets/mobirise-slider-video/script.js"></script> 
    <script src="assets/formoid/formoid.min.js"></script> 
    <!-- lightgallery --> 
    <script src="assets/theme/js/lightgallery.min.js"></script> 
    <script src="assets/theme/js/lg-thumbnail.min.js"></script> 
    <script src="assets/theme/js/lg-fullscreen.min.js"></script> 
    <script src="assets/theme/js/lg-share.min.js"></script> 
    <script src="assets/theme/js/lg-zoom.min.js"></script> 
    <script src="assets/theme/js/lg-autoplay.min.js"></script> 

Answer 1

Wooooooooooo Haaaaaa ich es endlich gelöst, und das Problem war, vielleicht mit lokaler Version Ich habe !! Als ich zur cdnjs Version wechselte, funktionierte es PERFEKT !!! ein großes Dankeschön für euch alle !! alles, was ich tat, ist die auf lokaler Ebene mit den CDN-Links

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.3.2/css/lightgallery.css" /> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.3.2/js/lightgallery.js"></script> 

Answer 2

im Kopf

<link href="https://cdn.rawgit.com/sachinchoolur/lightgallery.js/master/dist/css/lightgallery.css" rel="stylesheet"> 

Ihre HTML ersetzen.

<div id="lightgallery"> 
    <a href="img/img1.jpg"> 
     <img src="img/thumb1.jpg" /> 
    </a> 
    <a href="img/img2.jpg"> 
     <img src="img/thumb2.jpg" /> 
    </a> 
</div> 

im Körper. am Ende nach jquery

<script src="https://cdn.rawgit.com/sachinchoolur/lightgallery.js/master/dist/js/lightgallery.js"></script> 
<script src="https://cdn.rawgit.com/sachinchoolur/lg-pager.js/master/dist/lg-pager.js"></script> 
<script src="https://cdn.rawgit.com/sachinchoolur/lg-autoplay.js/master/dist/lg-autoplay.js"></script> 
<script src="https://cdn.rawgit.com/sachinchoolur/lg-fullscreen.js/master/dist/lg-fullscreen.js"></script> 
<script src="https://cdn.rawgit.com/sachinchoolur/lg-zoom.js/master/dist/lg-zoom.js"></script> 
<script src="https://cdn.rawgit.com/sachinchoolur/lg-hash.js/master/dist/lg-hash.js"></script> 
<script src="https://cdn.rawgit.com/sachinchoolur/lg-share.js/master/dist/lg-share.js"></script> 
<script> 
    lightGallery(document.getElementById('lightgallery')); 
</script>