Sayfanın bir bölümüne gitmek için nasıl kullanılır?

Question

Bağlantıları olan bir açılış sayfam var. Kullanıcıyı farklı bir sayfanın bir bölümüne nasıl yönlendirebilirim?

Ana Sayfa:

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

Örnek Sayfa: Ana Sayfa "Sushi" veya "BBQ" konulu

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

tıklamak (id sushi veya bbq ile div kullanıcıyı gezinmek gerekir sırasıyla) sample.

JQuery olmadan mümkün mü? JQuery'yi kullanmıyorum ama html kullanarak daha basit bir çözüm de işe yarayacaktı.

Answer 1

Kullanım HTML'nin anchors:

Ana Sayfa:

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

Örnek Sayfa:

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

Answer 2

<a href="#sushi">Sushi</a> 

Answer 3

Kullanım çapalar tarafından kendisine

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

ve bağlantı ile div sarın.

Ana Sayfa:

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

Örnek Sayfa:

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

Answer 4

HTML ile çapa kullanarak mümkündür. Kullanıcıyı HTML 'a' etiketi hakkında okunan belirli bir bölüme taşımak isterseniz.

W3Chools: 1 | 2

Answer 5

Ana sayfa

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

örnek sayfaları

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

Answer 6

bölümünde aracılığıyla bir ifadesi kullanın o

aracılığıyla yukarıda

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

Çağrısı işleri

Kaydırma, jquery yapıştırması gerektirir.

<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> 

Answer 7

Çözümlerim:

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

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