fullpage yatay kaydırıcı

Question

Ben boot ile fullpage.js kullanıyorum.

<div class="section fp-auto-height"> 
     <div class="container"> 
      <div class="row"> 
       <div class="heading">header text</div> 
       <div class="slide" id="slide1">Horizontal slider1</div> 
       <div class="slide" id="slide2">Horizontal slider2</div> 
      </div> 
     </div> 
</div> 

herhangi bir fikir neden çalışmıyor: bu nedenle, otomatik yüksekliğe sahip Benim kesitler yatay kaydırıcı ile birşeyler yanlıştır, herhangi text.Here kodudur göstermez?

Answer 1

required HTML structure ile ilgili fullpage.js belgelerini okudunuz mu?

slaytlar için yapı aşağıdaki gibi görünmelidir:

<div class="section"> 
    <div class="slide"> Slide 1 </div> 
    <div class="slide"> Slide 2 </div> 
    <div class="slide"> Slide 3 </div> 
    <div class="slide"> Slide 4 </div> 
</div> 

So ...

• sizin row elemanı
• sizin heading eleman Kaldır çıkarın.

• container öğenizi kaldırın.

  Yatay slider1 Yatay slider2

o belirli bölümde tüm slaytlar için bir başlık istiyorsanız, o zaman position:absolute ve position:relative bölümünü kullanmak zorunda olacak:

<div class="section fp-auto-height"> 
    <div class="header">Demo</div> 
    <div class="slide" id="slide1">Horizontal slider1</div> 
    <div class="slide" id="slide2">Horizontal slider2</div> 
</div> 

Css

.header{ 
    position:absolute; 
    top: 0; 
} 
.section { 
    position:relative; 
} 

Reproduction online