Come far funzionare gli effetti jQuery su Firefox e Google Chrome?
-
19-08-2019 - |
Domanda
Sto frugando con jQuery e il fadeIn & amp; effetti di dissolvenza. Ho il seguente codice per visualizzare e nascondere un div con un messaggio.
`
<script type="text/javascript">
$(document).ready(function() {
$("button").click(function() {
$("#upd").fadeIn(3000);
$("#upd").fadeOut(20000);
});
});
</script>
<style type="text/css">
div
{
background: rgb(237, 243, 254);
margin: 0px 0px 5px 0px;
padding: 13px 30px 13px 30px;
width: 300px;
}
</style>
`
Funziona perfettamente su Internet Explorer, ma non fa nulla in Chrome e ho il comportamento di mostrare e nascondere in Firefox.
Esiste un passaggio speciale affinché questa libreria funzioni in modo uniforme o almeno vicino in tutti i browser?
Soluzione
Prova fadeOut dal callback di fadeIn . Ciò garantirà che quest'ultimo effetto venga eseguito una volta completato il primo e non durante:
$(document).ready(function(){
$("button").click(function(){
$("#upd").fadeIn(3000,function(){
$(this).fadeOut(2500);
});
});
});
jQuery dovrebbe funzionare quasi allo stesso modo in tutti i browser da solo. Se stai assumendo comportamenti strani, probabilmente stai facendo qualcosa di sbagliato - non jQuery :)
Altri suggerimenti
Uno, assicurati di utilizzare l'ultima jQuery e che Javascript sia abilitato in tutti i tuoi browser.
In secondo luogo, prova a concatenare le chiamate fadeIn
e fadeOut
:
$("button").click(function() {
$("#upd")
.fadeIn(3000)
.fadeOut(20000);
});
Ecco il problema: (; Tasto " ") $
Non esiste alcun elemento come il pulsante, se è una classe quindi: $ ('. pulsante')
... e se è un id allora: $ ( '# Tasto')