0byt3m1n1
Path:
C:
/
wamp64
/
www
/
WaterCat
/
[
Home
]
File: news.php
<!DOCTYPE html> <html> <head> <title>Image Slideshow</title> <link rel="stylesheet" type="text/css" href="styles.css"> <link rel="stylesheet" type="text/css" href="nav.css"> <style> .slideshow-container { max-width: 1000px; position: relative; margin: auto; } .mySlides { display: none; } .prev, .next { cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -22px; color: white; font-weight: bold; font-size: 18px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; } .next { right: 0; border-radius: 3px 0 0 3px; } .prev:hover, .next:hover { background-color: rgba(0, 0, 0, 0.8); } .button { background-color: #4CAF50; /* Green */ border: none; color: white; padding: 10px 30px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; } </style> </head> <body> <body class="bg-white" background="assets/images/slider/s1.jpg" alt=""> <div class="topnav"> <a class="active" href="indexnew.php">Home</a> <a href="#news">News</a> <a href="contact.php">Contact</a> <a href="about.html">About</a> </div> <div class="slideshow-container"> <?php $servername="localhost"; $username="root"; $password=""; $dbname="watercat"; $conn=new mysqli($servername,$username,$password,$dbname); if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } $sql = "SELECT * FROM images"; $result = $conn->query($sql); if ($result->num_rows > 0) { while($row = $result->fetch_assoc()) { echo '<div class="mySlides"> <img src="gallery/'.$row["image_name"].'" style="width:100%"> </div>'; } } else { echo "0 results"; } $conn->close(); ?> <a class="prev" onclick="plusSlides(-1)">❮</a> <a class="next" onclick="plusSlides(1)">❯</a> </div> <script> var slideIndex = 1; showSlides(slideIndex); function plusSlides(n) { showSlides(slideIndex += n); } function currentSlide(n) { showSlides(slideIndex = n); } function showSlides(n) { var i; var slides = document.getElementsByClassName("mySlides"); if (n > slides.length) {slideIndex = 1} if (n < 1) {slideIndex = slides.length} for (i = 0; i < slides.length; i++) { slides[i].style.display = "none"; } slides[slideIndex-1].style.display = "block"; } // Automatically change slides every 3 seconds setInterval(function() { plusSlides(1); }, 3000); </script> </body> </html>