Glide Carousel & Semantic UI

In this example below you will see how to do a Glide Carousel & Semantic UI with some HTML / CSS and Javascript

This pen is a quick demo of the Glide Carousel & Semantic UI (with version 0.12.0 css)

Thumbnail
This awesome code was written by yowainwright, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright yowainwright ©

Technologies

  • HTML
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>Glide Carousel & Semantic UI</title>
  
  
  <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/0.12.0/css/semantic.min.css'>
<link rel='stylesheet prefetch' href='https://jeffry.in/old-jeffry-in/css/jeffry.in.css'>
<link rel='stylesheet prefetch' href='https://jeffry.in/old-jeffry-in/css/jeffry.in.slider.css'>
<link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Lobster|Raleway:300,500,700'>

  
  
</head>

<body>

  <div class="slider slider1">
    <div class="slides">
      <div class="slide-item item1">
      </div>
      <div class="slide-item item2"> 
      </div>
      <div class="slide-item item3">
      </div>
      <div class="slide-item item4">
      </div>
  </div>
</div>
  <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdn.jsdelivr.net/jquery.glide/1.0.6/jquery.glide.min.js'></script>

  

    <script  src="js/index.js"></script>




</body>

</html>


/*Downloaded from https://www.codeseek.co/yowainwright/glide-carousel-andamp-semantic-ui-GoggrV */
$('.slider').glide({
  autoplay: false,
  arrowsWrapperClass: 'slider-arrows',
  arrowRightText: '',
  arrowLeftText: ''
});

Comments

More from yowainwright

Stickybits Demo with Shrinked Header

Stickybits Demo with Shrinked Header

By yowainwright
CSS `position: sticky` example

CSS `position: sticky` example

By yowainwright
A Pen by Jeff Wainwright

A Pen by Jeff Wainwright

By yowainwright
Intl API exploration

Intl API exploration

By Jeff Wainwright

You Might Also Like

Froala Full Feature Editor Demo

Froala Full Feature Editor Demo

By bleutzinn
Tello.com

Tello.com

By spotless_iu
Cinema Paradiso Movies

Cinema Paradiso Movies

By melanielin
A Pen by km mk

A Pen by km mk

By canonfanon
Weather app

Weather app

By duqian91
A Pen by Joe Early

A Pen by Joe Early

By joeefp
Thunderbolt &#x2014; textboard

Thunderbolt — textboard

By tolgaozisik
Mobile First and Inline Styles Problem

Mobile First and Inline Styles Problem

By duncanmcdougall
© 2018 - Copyright CodeSeek.co
contact email