"Business Logo slider"
Bootstrap 4.1.1 Snippet by Poojathakur

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.css" /> <title>Business logo slider</title> </head> <body> <!-- ===============================Business Logo start=============================== --> <section class="business-logo"> <div class="container"> <div class="autoplay"> <div class="b-logo"> <img src="https://img.freepik.com/free-vector/letter-s-logo-negative-space-style-corporate-business-emblem-logotype_126523-2780.jpg?w=360&t=st=1671774874~exp=1671775474~hmac=e94409a1a83800e361c1f91ba030a8b4ea32a26e09c27d15c5413f5b4d4fe99a"> </div> <div class="b-logo"> <img src="https://img.freepik.com/free-vector/abstract-logo-flame-shape_1043-44.jpg?w=360&t=st=1671774847~exp=1671775447~hmac=455b5937eca7393674d27ace834a5e8e7a6464a821852d2fa28fca117f556c45"> </div> <div class="b-logo"> <img src="https://img.freepik.com/free-vector/logo-with-three-flower-petals_1017-4311.jpg?w=360&t=st=1671774993~exp=1671775593~hmac=acf41e64371bfd307db502c5a9250d94d18cedcac78a7f1dcb49226b2641f21d"> </div> <div class="b-logo"> <img src="https://img.freepik.com/free-vector/purple-abstract-geometrical-logo-3d_1043-55.jpg?w=360&t=st=1671775015~exp=1671775615~hmac=62728b03865d6d4d085718e3fc77b230edf252b17ca9a455c62660599c8c9ddc"> </div> <div class="b-logo"> <img src="https://img.freepik.com/free-vector/logo-template-background_1390-55.jpg?w=360&t=st=1671775042~exp=1671775642~hmac=a9cb74b818ef522d4463326baddb554ae62c7e21d7bf8f5faab642c6ae19b57f"> </div> <div class="b-logo"> <img src="https://img.freepik.com/free-vector/logo-with-curly-arrow_1043-146.jpg?w=360&t=st=1671775076~exp=1671775676~hmac=4fbff9695993b13b1e968df5049d2b4bf10027cb9c0d9966a6751b5f6ff64098"> </div> </div> </div> </section> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js"></script> <!-- ===============================Business Logo End=============================== --> </body> </html>
.business-logo { padding: 25px 0px; background: #e9f0f1; } .b-logo img { width: 304px; height: 152px; object-fit: scale-down; }
$('.autoplay').slick({ slidesToShow: 4, slidesToScroll: 1, autoplay: true, arrows: false, autoplaySpeed: 3000, });

Related: See More


Questions / Comments: