MickSlash
/
SomethingThatDoesntSuck
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

#Added Slick instead of Bootstrap's Carousel

Test
Lucio Vignotto 2020-07-18 11:05:41 +02:00
parent 797be71a1a
commit 2f73c64720
1 changed files with 35 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
Src/profilo.html
View File

@ -7,7 +7,8 @@
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="http://kenwheeler.github.io/slick/slick/slick-theme.css"/>
<title>Profilo di ...</title>
<style>
#mainbody{
@ -188,7 +189,15 @@
<h3 class="text-center">FILM PREFERITI</h3>
</div>
<div class="card mb-3 personalprofile">
<div id="carouselfavorite" class="carousel slide mx-auto" data-ride="carousel">
<div class="multiple-items">
<div><img src="https://image.tmdb.org/t/p/w1280/ftavpq2PJn5pyo5opJEmj8QleKD.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/imzvb941su6uhQ158GGurk7vF28.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/or06FN3Dka5tukK1e9sl16pB3iy.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/eSkjK4kctyrWpFhxl35GPvSs6tI.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/e1nWfnnCVqxS2LeTO3dwGyAsG2V.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/e0B6i48kxdRkMcK4tR4YNfXGWOc.jpg" class="img-fluid" alt="..."></div>
</div>
<!-- <div id="carouselfavorite" class="carousel slide mx-auto" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselfavorite" data-slide-to="0" class="active"></li>
<li data-target="#carouselfavorite" data-slide-to="1"></li>
@ -219,13 +228,21 @@
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div> -->
</div>
<div class="card-header card-comments">
<h3 class="text-center">DA GUARDARE</h3>
</div>
<div class="card mb-3 personalprofile">
<div id="carouselExampleCaptions" class="carousel slide mx-auto" data-ride="carousel">
<div class="multiple-items">
<div><img src="https://image.tmdb.org/t/p/w1280/ftavpq2PJn5pyo5opJEmj8QleKD.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/imzvb941su6uhQ158GGurk7vF28.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/or06FN3Dka5tukK1e9sl16pB3iy.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/eSkjK4kctyrWpFhxl35GPvSs6tI.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/e1nWfnnCVqxS2LeTO3dwGyAsG2V.jpg" class="img-fluid" alt="..."></div>
<div><img src="https://image.tmdb.org/t/p/w1280/e0B6i48kxdRkMcK4tR4YNfXGWOc.jpg" class="img-fluid" alt="..."></div>
</div>
<!-- <div id="carouselExampleCaptions" class="carousel slide mx-auto" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
@ -256,6 +273,7 @@
<span class="sr-only">Next</span>
</a>
</div>
</div> -->
</div>
</div>
<div class="col-lg-4 mr-0">
@ -320,8 +338,20 @@
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
<script src="./assets/js/changetheme.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.multiple-items').slick({
arrows:true,
infinite: true,
slidesToShow: 3,
slidesToScroll: 3
});
});
</script>
</body>
</html>