Facebook
From Walloping Octupus, 3 Years ago, written in HTML5.
Embed
Download Paste or View Raw
Hits: 233
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.     <meta charset="UTF-8">
  4.     <title>Document</title>
  5.     <link rel="stylesheet" href="vendor/normalize.css">
  6.     <link rel="stylesheet" href="vendor/flickity.min.css">
  7.     <link rel="stylesheet"  href="css/style.css">
  8. </head>
  9.  
  10. <div class="main-carousel">
  11. <div id="page-wrapper" class="container">
  12.         <h2>carousel</h2>
  13.         <div id="results"></div>
  14. </div>
  15.   <div class="carousel-cell" style="background-image:url('https://images.unsplash.com/photo-1489186397658-228f2a7ac8ee?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=f07f91379421cc817cec6cc9549095fb&auto=format&fit=crop&w=500&q=60');">
  16.         <div class="container">
  17.                
  18.         <button class="reset_button">Reset</button>
  19.          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed aliquet lacus eget rhoncus sagittis. Vivamus tellus elit, dapibus vitae leo a, lobortis eleifend augue.
  20.   </div>
  21.         </div>
  22.   <div class="carousel-cell" style="background-image:url('https://images.unsplash.com/photo-1531819177115-428566ccfb50?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=c1be2bfaa2785263750283980fe57e79&auto=format&fit=crop&w=500&q=60');">
  23.         <div class="container">
  24.                
  25.         <button class="reset_button">Reset</button>
  26.          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed aliquet lacus eget rhoncus sagittis. Vivamus tellus elit, dapibus vitae leo a, lobortis eleifend augue.
  27.  
  28.   </div>
  29. </div>
  30.   <div class="carousel-cell" style="background-image:url('https://images.unsplash.com/photo-1531830852055-5104a06e3806?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=e51ecfded5496e33eefb6e8c365456aa&auto=format&fit=crop&w=500&q=60');">
  31.   <div class="container">
  32.        
  33.          <button class="reset_button">Reset</button>
  34.          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed aliquet lacus eget rhoncus sagittis. Vivamus tellus elit, dapibus vitae leo a, lobortis eleifend augue.
  35.  
  36.   </div>
  37.         </div>
  38.   <div class="carousel-cell" style="background-image:url('https://images.unsplash.com/photo-1471347219181-ea568f4ef9a3?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=c49631166110b896075927b7534895fa&auto=format&fit=crop&w=500&q=60');">
  39.         <div class="container">
  40.                
  41.                 <button class="reset_button">Reset</button>
  42.          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed aliquet lacus eget rhoncus sagittis. Vivamus tellus elit, dapibus vitae leo a, lobortis eleifend augue.
  43. </div>
  44.   </div>
  45.        
  46.   <div class="carousel-cell" style="background-image:url('https://images.unsplash.com/photo-1519222588400-47f6bea38294?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=dc0077daebb63d648cc5bdf8b314f4d5&auto=format&fit=crop&w=500&q=60');">
  47.  
  48. <div class="container">
  49.        
  50.         <button class="reset_button">Reset</button>
  51.          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed aliquet lacus eget rhoncus sagittis. Vivamus tellus elit, dapibus vitae leo a, lobortis eleifend augue.
  52. </div>
  53.   </div>
  54. </div>
  55. <div class= "pbcontainer">
  56.         <div class="pb"></div>
  57. </div>
  58.    <script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>
  59.  
  60.  
  61.    
  62.    <script src="js/script.js"></script>
  63. </body>
  64. </html>