Quote:
Originally Posted by
marain
Is there a simple fix?
Well, it looks as though the script that you have chosen for your project is faulty. :confused:
So you could go back to the authors with your complaint.
Alternatively, you could use a CSS method instead. :cool:
Here is an example for your consideration...
Code:
<!DOCTYPE HTML>
<html lang="en">
<head>
<base href="https://www.njgunlawyers.com/">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">
<title>Untitled document</title>
<link rel="stylesheet" href="screen.css" media="screen">
<style media="screen">
body {
background-color: #f0f0f0;
font: normal 1em / 1.5em sans-serif;
}
#slides {
position:relative;
height: 16em;
}
#slides img {
position: absolute;
height: 100%;
width: auto;
left: 50%;
transform:translate(-50%, 0);
opacity: 0;
box-shadow:0.4em 0.4em 0.4em rgba( 0, 0, 0, 0.4 );
animation: fadeinout 24s ease-in-out infinite;
}
#slides img:nth-child(1) {
animation-delay: 20s;
}
#slides img:nth-child(2) {
animation-delay: 16s;
}
#slides img:nth-child(3) {
animation-delay: 12s;
}
#slides img:nth-child(4) {
animation-delay: 8s;
}
#slides img:nth-child(5) {
animation-delay: 4s;
}
#slides img:nth-child(6) {
animation-delay: 0s;
}
@keyframes fadeinout{
8.333% {
opacity: 1;
}
16.666% {
opacity: 0;
}
}
</style>
</head>
<body>
<div id="slides">
<img src="images/fid236x191.jpg" alt="">
<img src="images/fid341x191.jpg" alt="">
<img src="images/fid178x191.jpg" alt="">
<img src="images/fid156x191.jpg" alt="">
<img src="images/fid287x191.jpg" alt="">
<img src="images/fid310x191.jpg" alt="">
</div>
</body>
</html>
