Come accedere a una sezione di una pagina

Ho una pagina con dei link.
Come posso diretta di un utente a una sezione di una pagina diversa?

Pagina Principale:

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

Pagina Di Esempio:

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

Clic su “Sushi” o “BARBECUE” nella Pagina Principale dovrebbe navigare l’utente al div con id sushi o bbq (rispettivamente) della pagina sample.

È possibile senza JQuery?
A me non dispiace utilizzo di JQuery, ma una soluzione più semplice, utilizzando html sarebbe un lavoro troppo.

InformationsquelleAutor truthSeekr | 2011-03-02



7 Replies
  1. 54

    Utilizzare HTML ancore:

    Pagina Principale:

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

    Pagina Di Esempio:

    <div id='sushi'><a name='sushi'></a></div>
    <div id='bbq'><a name='bbq'></a></div>
    • Si prega di link di Mozilla Developer Network la prossima volta. w3fools.com
  2. 14

    Avvolgere il div con

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

    e link da

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

    Utilizzare le ancore.

    Pagina Principale:

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

    Pagina Di Esempio:

    <div id='sushi'><a name="sushi"></a></div>
    <div id='bbq'><a name="bbq"></a></div>
    • funziona anche senza impostare il nome per il collegamento
  4. 4

    Utilizzare una chiamata al sezione, funziona

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

    Chiamato al

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

    Scorrimento esigenze jquery incollare questo.. sopra al fine corpo del tag di chiusura..

    <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>
  5. 2

    Pagina principale

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

    pagine di esempio

    <div id='page1'><a name="page1"></a></div>
    <div id='page2'><a name="page2"></a></div>
  6. 0

    Le Mie Soluzioni:


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

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

  7. 0

    Utilizzare l’ipertesto di riferimento e i tag ID,

    Di Destinazione Titolo Di Testo

    Qualche paragrafo di testo

    Testo Di Destinazione

    <h1><a href="#target">Target Text Title</a></h1>
    <p id="target">Target Text</p>

Lascia un commento