Button erst nach bestimmter Zeit einblenden
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
animation
auto
beispiel
browser
button
code
dank
http
iteration
linear animation
mode
sekunde
suche
support
timing
url
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Mit window.setTimeout("neu()", 5000);
Das sähe dann so aus:
<head> <style> .Buttonunsichtbar{ position:absolute; display: none; } .Buttonsichtbar{ position:absolute; } </style> <script> function buttonsichtbar(){ document.getElementById("Button").className="Buttonsichtbar"; } window.setTimeout("buttonsichtbar()", 5000); </script> </head> <body> <input type="button" id="Button" value="Klick Mich" class="Buttonunsichtbar"> </body>
Beitrag zuletzt geändert: 4.1.2014 18:45:47 von willstdueswissen -
Geht auch nur mit CSS:
@keyframes zeigedich{ from {opacity:0;height: auto;} to {opacity:1;height: auto;} } @-webkit-keyframes zeigedich{ from {opacity:0;height: auto;} to {opacity:1;height: auto;} } #button{ opacity:0; height: 0; animation-name: zeigedich; animation-duration: 1s; animation-timing-function: linear; animation-fill-mode: forwards; animation-delay: 5s; animation-iteration-count:1; animation-play-state: running; -webkit-animation-name: zeigedich; -webkit-animation-duration: 1s; -webkit-animation-timing-function: linear; -webkit-animation-fill-mode: forwards; -webkit-animation-delay: 5s; -webkit-animation-iteration-count: 1; -webkit-animation-play-state: running; }
Ganzes Beispiel: http://codepen.io/anon/pen/itGeF
Browser Support: http://caniuse.com/css-animation -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage