All geek questions in one place

JQuery Coin Slider - not working at all

I am trying to integrate Coin Slider into my page, and I have downloaded and attached the latest jquery to my header, as well as all the necessary slider files. However, the page just stacks the images, as if I were just pasting tags.

The paths for all files are correct. I tried to follow his instructions on the letter on the "How to Install" page, without any success. It will not work in IE8 or in the latest versions of Chrome or Firefox.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="stylesheet" href="css/paradigm.css" type="text/css" /> <link rel="stylesheet" href="css/coin-slider-styles.css" type="text/css" /> <script type="text/javascript" src="js/coin-slider.min.js"></script> <script type="text/javascript" src="js/coin-slider.js"></script> <script type="text/javascript" src="js/jquery-1.7.2.js"></script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Paradigm Solutions</title> </head> <body> <div id="container"> <div id="header"></div> <div id="navbar"></div> <div id="leftMenu"></div> <div id="coin-slider"> <a href="http://windows.microsoft.com/en-us/internet-explorer/products/ie/home/" target="_blank"> <img src="http://www.vexite.com/images/2011/06/browser-war-illustration.jpg" alt="IESucks" /> <span> <b>Don't Use IE</b><br /> Internet Explorer is an inferior product that should be destroyed. </span> </a> <a href="http://windows.microsoft.com/en-us/internet-explorer/products/ie/home/" target="_blank"> <img src="http://www.vexite.com/images/2011/06/browser-war-illustration.jpg" alt="IESucks" /> <span> <b>Don't Use IE</b><br /> Internet Explorer is an inferior product that should be destroyed. </span> </a> </div> </div> <script type="text/javascript"> $(document).ready(function() { $('#coin-slider').coinslider(); }); </script> </body> </html>
0
source share
4 answers

Change script tags with

 <script type="text/javascript" src="js/coin-slider.min.js"></script> <script type="text/javascript" src="js/coin-slider.js"></script> <script type="text/javascript" src="js/jquery-1.7.2.js"></script>

to

 <script type="text/javascript" src="js/jquery-1.7.2.js"></script> <script type="text/javascript" src="js/coin-slider.min.js"></script>

coin-slider depends on jQuery, so it must be loaded before .... And I suggest you remove js/coin-slider.js , since js/coin-slider.min.js and js/coin-slider.js are the same thing ... .min is just a shortened version of another

+4
source

The order of your javascript file is very important. jQuery should always be the first (as can be seen from the production documentation). In addition, you do not need BOTH coin slider. Not enough .min:

 <script type="text/javascript" src="js/jquery-1.7.2.js"></script> <script type="text/javascript" src="js/coin-slider.min.js">
+1
source

This may seem obvious, but the slide package is not always bundled with jQuery, so make sure you have jQuery in your javascript folder before linking it to c (:

+1
source

it works well

 <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="coin-slider.min.js"></script> <link rel="stylesheet" href="styles.css" type="text/css" /> <link rel="stylesheet" href="coin-slider-styles.css" type="text/css" />

check this link for code

0
source

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

More articles:


All Articles