au bas de ma page d'accueil, j'ai inclus un formulaire de contact et spécifié l'ancrage de cette section en tant que DIV ID = "Contact".
Lorsque le bouton de contact est cliqué sur n'importe quelle page, il doit naviguer sur la page d'accueil et Sur la charge de la page, faites défiler automatiquement automatiquement sur le formulaire de contact. P>
J'ai échoué pour que cela fonctionne pour que cela fonctionne après avoir examiné une question similaire que j'ai trouvée ici: JQuery Faites défiler à ID de la page différente lorsque j'essaie, il saute simplement sur le formulaire. Je veux qu'il défile bien. P>
(function($){
var jump=function(e) {
if (e) {
e.preventDefault();
var target = $(this).attr("href");
} else {
var target = location.hash;
}
$('html,body').animate({
scrollTop: $(target).offset().top
},1000,function() {
location.hash = target;
});
}
$('html, body').hide()
$(document).ready(function() {
$('a[href^=#]').bind("click", jump);
if (location.hash) {
setTimeout(function(){
$('html, body').scrollTop(0).show()
jump()
}, 0);
} else {
$('html, body').show()
}
});
3 Réponses :
Je ne suis pas sûr de ce que votre code est, mais j'ai pu le faire fonctionner. Une chose est, le code que vous avez posté, il manque un in index.html, en-tête: Mais dans toute autre page: suppression }) (jQuery) à la fin. Quoi qu'il en soit, découvrez ce que je faisais ici , je pense que c'est ce que vous cherchez pour. Je ne sais pas à quoi ressemble votre HTML de votre site Web, mais je pense que vous pouvez l'adapter. Tout ce que vous avez à faire est de définir l'attribut href du bouton de contact sur index.html # contact . Sur index.html, vous pouvez simplement utiliser #Contact et il fera la même chose. index.html dans l'en-tête de l'index.html empêche la page de la charge à deux fois, de sorte que JQuery fait simplement défiler la page vers le bas.
Petit conseil que j'ai rencontré lors de testants de votre code:
Parce que vous utilisez l'attribut href de l'étiquette d'ancrage, il s'agit de #Contact, que JQuery interprète comme une pièce d'identité.
Vous devrez ajouter un identifiant = "contact" à l'ancre afin de fonctionner, quelle que soit la page, il s'agit.
Essayez ceci, votre script est correct que la dernière ligne est manquante
(function ($) {
var jump = function (e) {
if (e) {
e.preventDefault();
var target = $(this).attr("href");
} else {
var target = location.hash;
}
$('html,body').animate({
scrollTop: $(target).offset().top
}, 1000, function () {
location.hash = target;
});
}
$('html, body').hide();
$(document).ready(function () {
$('a[href^=#]').bind("click", jump);
if (location.hash) {
setTimeout(function () {
$('html, body').scrollTop(0).show()
jump();
}, 0);
} else {
$('html, body').show();
}
});
})(jQuery)