Le fondu sur toute la page avec jquery
Donc, je suis d'essayer de fondu à la page lorsqu'un utilisateur accède à une autre section de mon site web. Après avoir lu un peu sur stack overflow, j'ai écrit le code suivant. Mais il semble désordonné/laid. Est-il une bonne façon de la fermeture d'une page web, ou est-ce tout hacky? Il me semble (pour le moment) aime ma page sous-évaluées avant qu'il ait la chance de s'estomper.
<link rel="stylesheet" href="http://www.catlard.com/styles/body.css" type="text/css"/>
<link rel="icon" href="http://www.catlard.com/caticon.ico" />
<link rel="shortcut icon" href="http://www.catlard.com/caticon.ico?v=2" />
<script src="http://code.jquery.com/jquery-latest.min.js" charset="utf-8"> </script>
<script type="text/javascript">
$(document).ready( function(){
$("html").hide();
$("html").delay(250).fadeIn();
$(window).unload(function () {
$("html").fadeOut();
});
});
</script>
Le navigateur dump de la page (dans la plupart des cas) avant de votre animation serait fini.
Eh bien, je ne suis pas voyant que le scintillement pour le moment, mais il semble raisonnable que ça allait arriver. Mais l'enjeu n'est-il pas d'affichage de:aucune juste cause de la non-jquery heureux ordinateurs tout simplement pas voir mon site web?
$(document).ready( function(){ $("html").hide();
Sont que vous essayez de cacher la page avant que n'importe qui peut le voir? $(document).ready
va se produire lorsque les autres le contenu est chargé, je pense à l'instant, vous aurez probablement voir le chargement de la page pour une seconde, puis le scintillement & pour disparaître, puis fadeIn? Si oui, vous voudrez probablement utiliser display:none
avant le chargement de la place, et de ne pas s'embêter avec $("html").hide();
Eh bien, je ne suis pas voyant que le scintillement pour le moment, mais il semble raisonnable que ça allait arriver. Mais l'enjeu n'est-il pas d'affichage de:aucune juste cause de la non-jquery heureux ordinateurs tout simplement pas voir mon site web?
OriginalL'auteur Catlard | 2013-10-16
Vous devez vous connecter pour publier un commentaire.
Utilisation
fadeOut()
fonction jQuery pourdocument
ou"html"
:ou
Après lecture de vos commentaires, je comprends que vous voulez de la fermeture de la page lorsque vous cliquez sur un lien.
Ne pas utiliser
$(window).unload
mais de détecter les événements de clic sur les liens et de définir l'emplacement manuellement empêchant le comportement par défaut du navigateur.J'ai mis à jour ma réponse. Utilisation
$(document).on("click", "a" handler)
au lieu deunload
.Le code que vous avez posté est magique, et résolu tous mes problèmes. Je m'efforcerai de le comprendre! Je pense qu'il y a quelques choses que je ne comprends pas encore...la plupart des elle tourne autour de moi ne sachant pas ce qu'est un hash est, ou ce que l'emplacement de l'objet. Je peux probablement trouver facilement. Mais pouvez-vous expliquer pourquoi return false empêche le comportement par défaut du navigateur? Est-ce juste de la partie .sur la fonction de() en jQuery? Grâce à un bajillion!
Bon. Voir les commentaires dans le code, et pour
return false;
partie voir ce sujet. Par exemple, si vous supprimezreturn false;
du présent code, le navigateur va charger la nouvelle page (le lien) directement et l'effet de fondu de sortie va disparaître. C'est pourquoi nous l'utilisons ici, et nous avons établi le nouvel emplacement de js côté.return false;
est également utilisé lors de la soumission d'un formulaire via ajax (sans rechargement de la page). Lire plus d'informations dans la réponse à la question. 🙂 Si vous avez des questions n'hésitez pas.génial solution ty
OriginalL'auteur Ionică Bizău