Bonjour,
Je débute en javascript !
En préambule : je suis en train de travailler sur un site avec une base bootstrap V3.3.6 et jquery V 1.11.2.
J'utilise un script "smooth scroll" qui fonctionne très bien lors des déplacements vers les ancres de ma page "index.php" via ma navbar.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
$(function() {
        $('a[href*=#]:not([href=#])').click(function() {
            if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
                var target = $(this.hash);
                target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
                if (target.length) {
                    $('html,body').animate({
                        scrollTop: (target.offset().top - 8)//top navigation height
                    }, 500);
                    return false;
                }
            }
        });
    });
Quand je suis sur une autre page ( ex: "page2.php") et que je reviens vers mon "index.php", j'ai un décalage.
Je me retrouve décalé vers le haut..et plus je pointe une ancre en bas de ma page index.php, plus le décalage est important.
Ci-dessous le code de ma navbar
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<nav id="template-navbar" class="navbar navbar-default custom-navbar-default navbar-fixed-top">
           <div class="container">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#Food-fair-toggle">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">
                        <img id="logo" src="../images/Logo_main.png" alt="Logo Julie Traiteur" class="logo img-responsive resizeImage">
                    </a>
                </div>
 
                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="Food-fair-toggle" aria-expanded="false">
                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="../index.php#header-slider" title="Accueil">Accueil</a></li>
                        <li><a href="../index.php#about" title="A propos">A propos</a></li>
                        <li><a href="../index.php#voyage" title="Les voyages de Julie">Les voyages de Julie</a></li>
                        <li><a href="../index.php#charcuterie" title="Charcuterie & Rotisserie">Charcuterie &amp; Rotisserie</a></li>
                        <li><a href="../index.php#animation" title="Animations">Animations</a></li>
                        <li><a href="../index.php#contact" title="Contact">Contact</a></li>
                        <li><a href="../index.php#plan" title="Adresse & Plan">Adresse &amp; Plan</a></li>
                        <li><a href="<?php echo $urlEspacePro ?>" style="color:#fb2034" title="Espace Pro">Espace Pro</a></li>
                    </ul>
                </div><!-- /.navbar-collapse -->
            </div><!-- /.row -->
        </nav>

côté section - ex ancre vers la section animation:
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
<section id="animation" class="animation" name="animation">
et j'ai rajouté ça il y a peu juste au dessus de ma balise <section> :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
<a href="#animation"></a>

J'ai testé plusieurs scripts et celui là ne fonctionne que sous firefox:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
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 -8
        },500,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();
    }
});
J'ai parcouru plusieurs forum dont celui-ci...là je sèche !
Auriez-vous un script qui gère les ancres sur du multipages et compatible tous navigateurs ??
Merci d'avance.
Jack