What is the reason why jQuery doesn't connect? enter image description here

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script type="text/javascript" src="slick/slick.min.js"></script> <script defer src="js/scripts.js"></script> 

enter image description here

JS code

 $(document).ready(function(){ $('.head-slider__slider').slick({ }); }); 

PS I connect for the slider, the connection code JQ copied from the slick slider documentation

  • JQ and third-party libraries, it is better to connect to <head></head> - Air
  • @Air, tried, did not help prntscr.com/j4ehpn prntscr.com/j4ehws - uzi_no_uzi
  • I think the whole problem in defer, in the first place defer guarantees order only within other defer. Secondly, it is recommended to use it only for external scripts. Try wrapping everything in $ (document) .ready () instead - Pavel Zabelin
  • and you connect from an external resource? - An excess of Gophers
  • Scripts should be either inside the head, or inside the body, and they have neither there nor there - andreymal

1 answer 1

You have incorrectly connected. You must add the keyword https: before each link in order to work.

I implemented such a small animation so that you can see that everything works and the problem is that you need to add the full path to external resources.

 $(".single-item").slick({ dots: true }); 
 .container { margin: 0 auto; padding: 40px; width: 80%; color: #333; background: #419be0; } .slick-slide { text-align: center; color: #419be0; background: white; } 
 <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/3.0.1/jquery-migrate.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script> <div class='container'> <div class='single-item'> <div><h3>1</h3></div> <div><h3>2</h3></div> <div><h3>3</h3></div> <div><h3>4</h3></div> <div><h3>5</h3></div> <div><h3>6</h3></div> </div> </div> 

  • one
    Links starting with // are also correct. - andreymal