Hallo,
ich bin ein blutiger Anfänger im Bereich HTML und Co. - Daher auch meine Frage: Ich möchte ein HTML-Element... speziell einen Button... nach einer bestimmten Zeit, z.B. 5 Sekunden nach Laden der Seite einblenden. Ich habe schon viel im Internet gesucht , aber irgendwie bin ich nie fündig geworden. Ich würde mich also riesig über eure Antwort freuen - was wäre denn der einfachste Weg dafür?
Danke schonmal für alle Hilfe
1. Den Button gibst du einen display:none;
2. Mit Javascript benutzt du setTimeout und gibst den Button ein display:block https://developer.mozilla.org/de/docs/Web/AP…mers/setTimeout
oder ohne Javascript
2. Du kannst das auch mit Css machen mit https://developer.mozilla.org/de/docs/Web/CSS/animation-delay
Sorry , hätte vieleicht sagen sollen das man bei Css opacity nehmen muß wenn es nur mit Css laufen soll.
Es gibt auch andere Varianten wie height und width auf 0px zu stellen ,oder die Position im nicht Sichtbaren Bereich zu schieben.
Kommt auch immer drauf an was du genau vor hast.
Hier sind Beispiele mit Css oder auch JS
Ok, ich habe jetzt mal das Skript aus dem anderem Thread genommen - Ich habe den Code versucht "umzuschreiben, damit ein Element nicht aus-, sondern eingeblendet wird... wie zu erwarten hatte ich mit meinen Fähigkeiten keinen Erfolg 
Hier der Code den ich in den Head meiner Website kopiert habe. Was habe ich falsch gemacht? Ich bin langsam echt verzwiefelt und suche jetzt schon den zweiten Tag in Folge nach einer Lösung...
<style type="text/css">
/*<![CDATA[*/
#cc-m-18638167825 { visibility: hidden; }
/*]]>*/
</style>
<style type="text/css">
//<![CDATA[
html, body {
height:100%;
width:100%;
margin:0;
padding:0;
}
#cc-m-18638167825 {
-moz-animation: cssAnimation 0s ease-in 5s forwards;
/* Firefox */
-webkit-animation: cssAnimation 0s ease-in 5s forwards;
/* Safari and Chrome */
-o-animation: cssAnimation 0s ease-in 5s forwards;
/* Opera */
animation: cssAnimation 0s ease-in 5s forwards;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@keyframes cssAnimation {
to {
width:0;
height:0;
overflow:visible;
}
}
@-webkit-keyframes cssAnimation {
to {
width:0;
height:0;
visibility:visible;
}
}
//]]>
</style>Was soll denn CDATA da?
Und auch ne ID wie diese "#cc-m-18638167825"?
Glaube kaum, das dass auf deinen Code zutrifft!
Die Präfixe (-moz, -webkit, -o) kannst du bei etablierten Sachen wie "animation" weglassen.
Welches Tool erstellt den solche Id's ?
Das habe ich schon mal irgendwo gesehen.
Wie wäre es damit ?
<style>
#cc-m-18638167825 {
display:block;
width:100px;
height:100px;
border:3px solid red;
animation: cssAnimation linear 5s forwards 1;
}
@keyframes cssAnimation {
0%,70%{
opacity:0;
}
100%{
opacity:1;
}
}
</style>
<div id="cc-m-18638167825">
Das ist deine Box</div>Danke für die tolle Hilfe - Hat endlich geklappt... ich benutze Jimdo - Da wird das CDATA autoatisch hinzugefügt und solche komischen IDs erstellt
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!