Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
- <style>
- .mySlides {display:none}
- </style>
- <body>
- <div class="w3-container">
- <h2>FAP</h2>
- </div>
- <div class="w3-center">
- <div class="w3-section">
- <button class="w3-btn" onclick="plusDivs(-1)">Prev</button>
- <button class="w3-btn" onclick="plusDivs(1)">Next</button>
- </div>
- <button class='w3-btn demo' onclick='currentDiv(1)'>1</button>
- <button class='w3-btn demo' onclick='currentDiv(2)'>2</button>
- <button class='w3-btn demo' onclick='currentDiv(3)'>3</button>
- <button class='w3-btn demo' onclick='currentDiv(4)'>4</button>
- <button class='w3-btn demo' onclick='currentDiv(5)'>5</button>
- <button class='w3-btn demo' onclick='currentDiv(6)'>6</button>
- <button class='w3-btn demo' onclick='currentDiv(7)'>7</button>
- <button class='w3-btn demo' onclick='currentDiv(8)'>8</button>
- <button class='w3-btn demo' onclick='currentDiv(9)'>9</button>
- <button class='w3-btn demo' onclick='currentDiv(10)'>10</button>
- <button class='w3-btn demo' onclick='currentDiv(11)'>11</button>
- <button class='w3-btn demo' onclick='currentDiv(12)'>12</button>
- <button class='w3-btn demo' onclick='currentDiv(13)'>13</button>
- <button class='w3-btn demo' onclick='currentDiv(14)'>14</button>
- <button class='w3-btn demo' onclick='currentDiv(15)'>15</button>
- <button class='w3-btn demo' onclick='currentDiv(16)'>16</button>
- <button class='w3-btn demo' onclick='currentDiv(17)'>17</button>
- <button class='w3-btn demo' onclick='currentDiv(18)'>18</button>
- <button class='w3-btn demo' onclick='currentDiv(19)'>19</button>
- <button class='w3-btn demo' onclick='currentDiv(20)'>20</button>
- <button class='w3-btn demo' onclick='currentDiv(21)'>21</button>
- <button class='w3-btn demo' onclick='currentDiv(22)'>22</button>
- <button class='w3-btn demo' onclick='currentDiv(23)'>23</button>
- <button class='w3-btn demo' onclick='currentDiv(24)'>24</button>
- <button class='w3-btn demo' onclick='currentDiv(25)'>25</button>
- <button class='w3-btn demo' onclick='currentDiv(26)'>26</button>
- <button class='w3-btn demo' onclick='currentDiv(27)'>27</button>
- <button class='w3-btn demo' onclick='currentDiv(28)'>28</button>
- <button class='w3-btn demo' onclick='currentDiv(29)'>29</button>
- <button class='w3-btn demo' onclick='currentDiv(30)'>30</button>
- <button class='w3-btn demo' onclick='currentDiv(31)'>31</button>
- <button class='w3-btn demo' onclick='currentDiv(32)'>32</button>
- <button class='w3-btn demo' onclick='currentDiv(33)'>33</button>
- <button class='w3-btn demo' onclick='currentDiv(34)'>34</button>
- </div>
- <br>
- <div class="w3-content" style="max-width:800px">
- <video class='mySlides' src='img/img12.mp4' style='width:100%' controls autoplay>
- <video class='mySlides' src='img/img33.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img39.png' style='width:100%'>
- <img class='mySlides' src='img/img35.jpg' style='width:100%'>
- <img class='mySlides' src='img/img34.jpg' style='width:100%'>
- <video class='mySlides' src='img/img25.mp4' style='width:100%' controls autoplay>
- <video class='mySlides' src='img/img9.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img16.jpg' style='width:100%'>
- <video class='mySlides' src='img/img3.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img42.jpg' style='width:100%'>
- <video class='mySlides' src='img/img43.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img13.jpg' style='width:100%'>
- <img class='mySlides' src='img/img21.jpg' style='width:100%'>
- <video class='mySlides' src='img/img22.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img11.jpg' style='width:100%'>
- <video class='mySlides' src='img/img41.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img7.gif' style='width:100%'>
- <img class='mySlides' src='img/img6.png' style='width:100%'>
- <video class='mySlides' src='img/img31.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img15.jpg' style='width:100%'>
- <video class='mySlides' src='img/img36.mp4' style='width:100%' controls autoplay>
- <video class='mySlides' src='img/img17.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img30.jpg' style='width:100%'>
- <img class='mySlides' src='img/img20.gif' style='width:100%'>
- <video class='mySlides' src='img/img19.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img27.gif' style='width:100%'>
- <video class='mySlides' src='img/img14.mp4' style='width:100%' controls autoplay>
- <video class='mySlides' src='img/img10.mp4' style='width:100%' controls autoplay>
- <img class='mySlides' src='img/img2.gif' style='width:100%'>
- <img class='mySlides' src='img/img1.jpg' style='width:100%'>
- <video class='mySlides' src='img/img26.mp4' style='width:100%' controls autoplay>
- <video class='mySlides' src='img/img28.mp4' style='width:100%' controls autoplay>
- <video class='mySlides' src='img/img0.mp4' style='width:100%' controls autoplay>
- <video class='mySlides' src='img/img18.mp4' style='width:100%' controls autoplay>
- </div>
- <script>
- var slideIndex = 1;
- showDivs(slideIndex);
- function plusDivs(n) {
- showDivs(slideIndex += n);
- }
- function currentDiv(n) {
- showDivs(slideIndex = n);
- }
- function showDivs(n) {
- var i;
- var x = document.getElementsByClassName("mySlides");
- var dots = document.getElementsByClassName("demo");
- if (n > x.length) {slideIndex = 1}
- if (n < 1) {slideIndex = x.length}
- for (i = 0; i < x.length; i++) {
- x[i].style.display = "none";
- }
- for (i = 0; i < dots.length; i++) {
- dots[i].className = dots[i].className.replace(" w3-red", "");
- }
- x[slideIndex-1].style.display = "block";
- dots[slideIndex-1].className += " w3-red";
- }
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment