onclick show-div und nach einigen Sekunden hide my dargestellt div
Brauche ich etwas Hilfe mit meinen button. ich will, wenn ich auf den button (Klick mich) die hidden-div zu sehen sein sollte, aber nach einigen Sekunden meine versteckten div automatisch ausblenden. Danke !!
Hier der code :
<!DOCTYPE html>
<html>
<head>
<style>
.show {
-o-transition: opacity 3s;
-moz-transition: opacity 3s;
-webkit-transition: opacity 3s;
transition: opacity 3s;
opacity:1;
}
.hide{ opacity:0; }
</style>
<script>
function ShowSecond()
{
var div2 = document.getElementById("div2");
div2.className="show";
}
</script>
</head>
<body>
<div id="div1" class="show">
First Div
<button onclick="ShowSecond()">clickMe</button>
</div>
<div id="div2" class="hide">
Hidden Div
</div>
</body>
</html>
- Als meine ans ist dasselbe, also nur hinzufügen demo-link. jsfiddle.net/k2Ggx/1
- Vielen Dank Neha, es funktioniert für mich perfekt.
- froh, dass es hilft :)!
Du musst angemeldet sein, um einen Kommentar abzugeben.
Können Sie die
setTimeout
Funktion:setTimeout(function() {
//your code here
}, 1000);
Dies führt die Funktion nach 1 Sekunde.
Wenn Sie jQuery verwenden möchten, können Sie die
.delay()
Funktion für diese:$(element).show().delay(1000).hide();
Mehr info:
https://api.jquery.com/delay/
In Ihrem
ShowSecond
Funktion haben, die folgendenDurch obigen code Ihrer
div
verstecken nach3s
. Zeit ist Ihre Wahl zu erhöhen oder zu verringern als Ihre AnforderungVerwenden Sie einfach
setTimeout
durchführen, time-delay-Operationen.JSFiddle
Grund, warum ich verwendet
setTimeout(..)
einer VariablentimeOut
: In Zukunft können Sie stornieren müssen diese timeout-operation, die getan werden kann, als clearTimeout(timeOut)Möchten Sie die setTimeout () - Funktion
Können Sie auch verwenden, CSS3
animation
statttransition
:ausführen demo
HTML
JS
CSS
Offensichtlich, es muss vorangestellt werden, cross-browser, und die Ebene JavaScript ist einfach zu kleben, um Ihren code, mit jQuery wird sich darum kümmern diese Dinge automatisch.