"SlidePageAds" பக்கத்தின் திருத்தங்களுக்கிடையேயான வேறுபாடு

00:10, 21 சூலை 2023 இல் நிலவும் திருத்தம்

<!DOCTYPE html> W3.CSS

❮ ❯

நூல்கள் [20,133] இதழ்கள் [17,442] பத்திரிகைகள் [69,513] பிரசுரங்கள் [1,365] நினைவு மலர்கள் [2,582] சிறப்பு மலர்கள் [7,241] எழுத்தாளர்கள் [8,977] பதிப்பாளர்கள் [7,189] வெளியீட்டு ஆண்டு [238] குறிச்சொற்கள் [127] வலைவாசல்கள் [25] சுவடியகம் [24] நிறுவனங்கள் [1,926] வாழ்க்கை வரலாறுகள் [3,398]

உங்கள் பங்களிப்புகளுக்கு

@@ வரிசை 1: / வரிசை 1: @@
+<!DOCTYPE html>
 <html>
 <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 {
-          display:none;
-          position: relative;
-}
-.left-arrow, .right-arrow {
        position: absolute;
        top: 50%;
-      width: 40px;
-      height: 40px;
-      line-height: 40px;
-      text-align: center;
        font-size: 30px;
        cursor: pointer;
-       background-color: rgba(0, 0, 0, 0.5);
+       z-index: 1;
-       color: #fff;
+       padding: 10px;
-      user-select: none;
      }
+    .slideshow-arrow.left { left: 10px; }
-.left-arrow {
+     .slideshow-arrow.right { right: 10px; }
-      left: 0;
+  </style>
-     }
-</style>
 </head>
-நூலக நிறுவன நிதி கோரல் தொடர்பாக காட்சிப்படுத்துவதற்காக உருவாக்கப்பட்ட பரீட்சார்த்த பக்கம்
 <body>
-<div class="w3-content w3-section" style="max-width:1200px">
+<div class="w3-content w3-section" style="max-width:1200px; position: relative;">
-  <span class="left-arrow">&#10094;</span>
-  <span class="right-arrow">&#10095;</span>
    <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%">
@@ வரிசை 45: / வரிசை 28: @@
    <img class="mySlides" src="https://noolaham.org/wiki/images/4/48/Forth.jpeg" style="width:100%">
+  <span class="slideshow-arrow left" onclick="changeSlide(-1)">&#10094;</span>
+  <span class="slideshow-arrow right" onclick="changeSlide(1)">&#10095;</span>
 </div>
+<script>
+  var myIndex = 0;
+  carousel();
-<script>
+  function carousel() {
-var myIndex = 0;
+    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 carousel() {
+  function changeSlide(offset) {
-  var i;
+    var x = document.getElementsByClassName("mySlides");
-  var x = document.getElementsByClassName("mySlides");
+    myIndex += offset;
-  for (i = 0; i < x.length; i++) {
+    if (myIndex > x.length) { myIndex = 1; }
-    x[i].style.display = "none";
+    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";
    }
-  myIndex++;
-  if (myIndex > x.length) {myIndex = 1}
-  x[myIndex-1].style.display = "block";
-  setTimeout(carousel, 4000); // Change image every 6 seconds
-}
 </script>
 </body>
 </html>