Just an example of a full width carousel in Bootstrap
A Pen by Matt Lambert on CodePen.
Alasom Lira alasomlira
alasomlira
/ full-width-bootstrap-carousel.markdown
Last active
January 17, 2020 19:37
Full Width Bootstrap Carousel
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> | |
| <a href="https://api.whatsapp.com/send?phone=51955081075&text=Hola%21%20Quisiera%20m%C3%A1s%20informaci%C3%B3n%20sobre%20Varela%202." class="float" target="_blank"> | |
| <i class="fa fa-whatsapp my-float"></i> | |
| </a> |
alasomlira
/ index.html
Created
December 17, 2019 17:36
Responsive Owl Carousel with Magnific Popup YouTube and Text
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="owl-carousel"> | |
| <div class="item"> | |
| <a class="popup-youtube" href="https://www.youtube.com/watch?v=5SJml0MBhW4?autoplay=1&rel=0&controls=0&showinfo=0&wmode=transparent"> | |
| <img src="https://res.cloudinary.com/milairagny/image/upload/v1487938016/pexels-photo-4_tfmpvk.jpg"><i class="fa fa-play" aria-hidden="true"></i></a> | |
| </div> | |
| <div class="item"> | |
| <a class="popup-youtube" href="https://www.youtube.com/watch?v=5SJml0MBhW4?autoplay=1&rel=0&controls=0&showinfo=0&wmode=transparent"><img src="https://res.cloudinary.com/milairagny/image/upload/v1487938017/pexels-photo-3_ppz2bb.jpg"><i class="fa fa-play" aria-hidden="true"></i></a> | |
| </div> | |
| <div class="item"> | |
| <a class="popup-text" href="#1"> |
Image with title and subtitle on hover
A Pen by LittleSnippets.net on CodePen.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //- https://dribbble.com/shots/3888265-Motion-Study | |
| - | |
| var images = [ // Images by various people from Unsplash | |
| { | |
| name: 'Benjamin Hung', | |
| loc: 'Shibuya, Japan', | |
| src: 'EYmhcdGuYmI', | |
| url: 'ef5af971-fc46-4ee1-a589-980346478696_opt.png' | |
| }, { |
Image with title and caption on hover
A Pen by LittleSnippets.net on CodePen.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="sync1" class="owl-carousel owl-theme"> | |
| <div class="item"> | |
| <h1>1</h1></div> | |
| <div class="item"> | |
| <h1>2</h1></div> | |
| <div class="item"> | |
| <h1>3</h1></div> | |
| <div class="item"> | |
| <h1>4</h1></div> | |
| <div class="item"> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="header"> | |
| <div class="logo"> | |
| <a href="#">Responsive Nav</a> | |
| </div> | |
| <nav> | |
| <form class="search" action="search.php"> | |
| <input name="q" placeholder="Search..." type="search"> | |
| </form> | |
| <ul> | |
| <li> |
alasomlira
/ bootstrap-4-mega-dropdown-menu-navbar.markdown
Created
December 16, 2019 18:49
Bootstrap 4 Mega Dropdown Menu Navbar
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="player"> | |
| <span id="playback" class="fa fa-play fa-lg"></span> | |
| </div> | |
| <audio> | |
| <source id="sourceOgg" type="audio/ogg" /> | |
| <source id="sourceMp3" type="audio/mpeg" /> | |
| </audio> |
NewerOlder