Comment naviguer vers une section d'une page

J'ai une page d'atterrissage avec des liens.
Comment puis-je direct de l'utilisateur à une section d'une autre page?

La Page Principale:

<a href="/sample">Sushi</a>
<a href="/sample">BBQ</a>

Exemple De Page:

<div id='sushi'></div>
<div id='bbq'></div>

Cliquant sur "Sushi" ou "BARBECUE" dans la Page Principale devrait éviter à l'utilisateur de la div avec l'id sushi ou bbq (respectivement) de la page sample.

Est-il possible sans JQuery?
Je n'ai pas l'esprit à l'aide de JQuery, mais une solution plus simple en utilisant le html serait trop de travail.

source d'informationauteur truthSeekr

  1. 45

    Utiliser de l'HTML les ancres:

    La Page Principale:

    <a href="sample.html#sushi">Sushi</a>
<a href="sample.html#bbq">BBQ</a>

    Exemple De Page:

    <div id='sushi'><a name='sushi'></a></div>
<div id='bbq'><a name='bbq'></a></div>
  2. 9

    Envelopper votre div avec 

    <a name="sushi">
  <div id="sushi">
  </div>
</a>

    et de la lier par 

    <a href="#sushi">Sushi</a>
  3. 4

    Utiliser des ancres.

    La Page Principale:

    <a href="/sample#sushi">Sushi</a>
<a href="/sample#bBQ">BBQ</a>

    Exemple De Page:

    <div id='sushi'><a name="sushi"></a></div>
<div id='bbq'><a name="bbq"></a></div>
  4. 2

    Page principale

    <a href="/sample.htm#page1">page1</a>
<a href="/sample.htm#page2">page2</a>

    exemples de pages

    <div id='page1'><a name="page1"></a></div>
<div id='page2'><a name="page2"></a></div>
  5. 2

    Utiliser un appel thru section, il fonctionne

    <div id="content">
     <section id="home">
               ...
     </section>

    Appel ci-dessus thru 

     <a href="#home">page1</a>

    Défilement besoins jquery coller ce.. sur ci-dessus à la fin de corps balise de fermeture..

    <script>
  $(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
                  }, 1000);
                  return false;
              }
          }
      });
  });
</script>
  6. 1

    C'est possible avec le HTML à l'aide d'ancres. Si vous voulez aller de l'utilisateur à specifited article à lire sur HTML 'un' tag.

    W3Chools: Un | Deux

  7. 0

    Mes Solutions:


    $('body').scrollspy({target: '.target', offset: fix_header_height})

    $('.target').click(function () { $('body').animate(
    { scrollTop: $($(this).attr('href')).offset().top - fix_header_height }, 500) return })