All geek questions in one place

Smooth carousel does not work

I am trying to get a simple implementation of Slick Carousel.

I followed the instructions on the Git page: https://github.com/kenwheeler/slick

Here is my code. Can anyone see the problem? Does anyone have a simple working code example for a spot?

<html> <head> <title>My Now Amazing Webpage</title> <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.3.7/slick.css"/> </head> <body style="background-color: lightblue"> <div class="your-class"> <div><p>test1</p></div> <div><p>test2</p></div> <div><p>test3</p></div> </div> <script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.3.7/slick.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.your-class').slick(); }); </script> </body> </html>
+5
source share
1 answer

The reason it doesn't work is because you are running your html from a file. That means the URL scheme used for your script links is

 file:

instead

 http:

therefore your CDN links are resolved as

 file://code.jquery.com/jquery-1.11.0.min.js

which is clearly wrong.

Either connect the scheme to http: or by updating all the links to contain the scheme:

 <link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/jquery.slick/1.3.7/slick.css"/>

or run your code from the http context, not from the file on your HD.

+6
source

Source: https://habr.com/ru/post/1203178/

More articles:


All Articles