简体   繁体   中英

Javascript on visual studio

Hi im using visual studio 2017 and i have an html based site. I want use slick slider that already working on codepen but when i put in visual studio the javascript doesnt work please help me!

Slider Example

console.clear();
  $(".slider").slick({
      autoplay: true,    
      slidesToShow: 4,
      dots: false,
      responsive: [{ 
          breakpoint: 500,
          settings: {
              dots: false,
              arrows: false,
              infinite: false,
              slidesToShow: 2,
              slidesToScroll: 2
          } 
      }]
  });

Take a look if you added the library at the head tag in your code.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>

Also, be sure you load it before your script. In codepen you can add the library in the settings, so maybe you forgot to load it in your code in VS. If that doesn't solve your problem, it would be nice if you take a look at your console error... So we can know the problem and help you better.

My libraries is:

 <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" /> <link rel="stylesheet" href="https://anijs.github.io/lib/anicollection/anicollection.css"/> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" /> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <link href="css/home.css" rel="stylesheet" /> <script src="js/carousel.js"></script> <script src="js/test.js"></script> 

As you can see in first photo i have already put into a test.js that include all javascrpit code tha im calling into my aspx

My css file:

 #dealss .slick-slider { font-size: 30px; line-height: 1; text-align: center; color: white; } .slick-slide { background: rgba(255,255,255,.4); padding: 40px 0; 

#dealss .slick-slider { font-size: 30px; line-height: 1; text-align: center; color: white; } .slick-slide { background: rgba(255,255,255,.4); padding: 40px 0;

 #dealss .slick-slider { font-size: 30px; line-height: 1; text-align: center; color: white; } .slick-slide { background: rgba(255,255,255,.4); padding: 40px 0; 

}

And my result is : Result

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM