Walter: Frage zum Wiki-Artikel „Bildwechsler“

Beitrag lesen

problematische Seite

Sorry, aber ich bin Amateur :-( ich habe folgendes Scripts - was ist denn falsch?

<style type="text/css">
main {
        background: transparent;
        border-color: transparent;
}

#gallery {
        position: relative;
        background: none;
        border: none;
}

#gallery figure {
        position: absolute;
        top: 0;
        left: 60px;
        z-index: 1;
        -webkit-animation: wechseln 15s infinite;
        animation: wechseln 15s infinite;
}

@keyframes wechseln {
        0% {opacity: 1;}
        25% {opacity: 1;}
        40% {opacity: 0;}
        92% {opacity: 0;}
        100% {opacity: 1;}
}

@-webkit-keyframes wechseln {
        0% {opacity: 1;}
        25% {opacity: 1;}
        40% {opacity: 0;}
        92% {opacity: 0;}
        100% {opacity: 1;}
}

#gallery figure:nth-of-type(8) {
        animation-delay: 5s;
}
#gallery figure:nth-of-type(7) {
        animation-delay: 5s;
}
#gallery figure:nth-of-type(6) {
        animation-delay: 5s;
}
#gallery figure:nth-of-type(5) {
        animation-delay: 5s;
}
#gallery figure:nth-of-type(4) {
        animation-delay: 5s;
}
#gallery figure:nth-of-type(3) {
        animation-delay: 5s;
}
#gallery figure:nth-of-type(2) {
        animation-delay: 5s;
}
#gallery figure:nth-of-type(1) {
        animation-delay: 10s;
}
</style>
und folgendes HTML/PHP

1. <main>
2.      <div id="gallery">
3.          <figure> <img src="<?echo $bild1 ;?>" alt="bild1"></figure>
4.          <figure> <img src="<?echo $bild2 ;?>" alt="bild2"></figure>
5.          <figure> <img src="<?echo $bild3 ;?>" alt="bild3"></figure>
6.          <figure> <img src="<?echo $bild4 ;?>" alt="bild4"></figure>
7.          <figure> <img src="<?echo $bild5 ;?>" alt="bild5"></figure>
8.          <figure> <img src="<?echo $bild6 ;?>" alt="bild6"></figure>
9.          <figure> <img src="<?echo $bild7 ;?>" alt="bild7"></figure>
10.          <figure> <img src="<?echo $bild8 ;?>" alt="bild8"></figure>
11.      </div>
12. </main>