"SlidePageAds" பக்கத்தின் திருத்தங்களுக்கிடையேயான வேறுபாடு
நூலகம் இல் இருந்து
| வரிசை 1: | வரிசை 1: | ||
| + | <!DOCTYPE html> | ||
<html> | <html> | ||
<head> | <head> | ||
| − | <title>W3.CSS</title> | + | <title>W3.CSS</title> |
| − | <meta name="viewport" content="width=device-width, initial-scale=1"> | + | <meta name="viewport" content="width=device-width, initial-scale=1"> |
| − | <meta content="text/html; charset=iso-8859-2" http-equiv="Content-Type"> | + | <meta content="text/html; charset=iso-8859-2" http-equiv="Content-Type"> |
| − | <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> | + | <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> |
| − | + | <style> | |
| − | + | .mySlides {display: none;} | |
| − | <style> | + | .slideshow-arrow { |
| − | .mySlides { | ||
| − | |||
| − | |||
| − | } | ||
| − | |||
| − | |||
position: absolute; | position: absolute; | ||
top: 50%; | top: 50%; | ||
| − | |||
| − | |||
| − | |||
| − | |||
font-size: 30px; | font-size: 30px; | ||
cursor: pointer; | cursor: pointer; | ||
| − | + | z-index: 1; | |
| − | + | padding: 10px; | |
| − | |||
} | } | ||
| − | + | .slideshow-arrow.left { left: 10px; } | |
| − | . | + | .slideshow-arrow.right { right: 10px; } |
| − | + | </style> | |
| − | } | ||
| − | </style> | ||
| − | |||
| − | |||
</head> | </head> | ||
| − | |||
<body> | <body> | ||
| − | <div class="w3-content w3-section" style="max-width:1200px | + | <div class="w3-content w3-section" style="max-width:1200px; position: relative;"> |
| − | |||
| − | |||
<img class="mySlides" src="https://noolaham.org/wiki/images/a/a7/First.jpeg" style="width:100%"> | <img class="mySlides" src="https://noolaham.org/wiki/images/a/a7/First.jpeg" style="width:100%"> | ||
<img class="mySlides" src="https://noolaham.org/wiki/images/a/a0/Second.jpeg" style="width:100%"> | <img class="mySlides" src="https://noolaham.org/wiki/images/a/a0/Second.jpeg" style="width:100%"> | ||
| வரிசை 45: | வரிசை 28: | ||
<img class="mySlides" src="https://noolaham.org/wiki/images/4/48/Forth.jpeg" style="width:100%"> | <img class="mySlides" src="https://noolaham.org/wiki/images/4/48/Forth.jpeg" style="width:100%"> | ||
| − | + | <span class="slideshow-arrow left" onclick="changeSlide(-1)">❮</span> | |
| − | + | <span class="slideshow-arrow right" onclick="changeSlide(1)">❯</span> | |
</div> | </div> | ||
| − | |||
| + | <script> | ||
| + | var myIndex = 0; | ||
| + | carousel(); | ||
| − | < | + | function carousel() { |
| − | + | var i; | |
| − | carousel | + | var x = document.getElementsByClassName("mySlides"); |
| + | for (i = 0; i < x.length; i++) { | ||
| + | x[i].style.display = "none"; | ||
| + | } | ||
| + | myIndex++; | ||
| + | if (myIndex > x.length) {myIndex = 1} | ||
| + | x[myIndex-1].style.display = "block"; | ||
| + | setTimeout(carousel, 6000); // Change image every 6 seconds | ||
| + | } | ||
| − | function | + | function changeSlide(offset) { |
| − | + | var x = document.getElementsByClassName("mySlides"); | |
| − | + | myIndex += offset; | |
| − | + | if (myIndex > x.length) { myIndex = 1; } | |
| − | + | if (myIndex < 1) { myIndex = x.length; } | |
| + | for (var i = 0; i < x.length; i++) { | ||
| + | x[i].style.display = "none"; | ||
| + | } | ||
| + | x[myIndex-1].style.display = "block"; | ||
} | } | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
</script> | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
00:10, 21 சூலை 2023 இல் நிலவும் திருத்தம்
<!DOCTYPE html>