Fullpage.jsプラグインセクションの位置要素

私のウェブサイトにはfullpage.jsプラグインが使用されています。私はすべてのセクションに私のウェブサイトのロゴを入れましたが、私はページをリフレッシュすると、最初のセクションの高さは数秒で小さく、いくつかのセクションの後は通常です。これは私のコードです：問題ですFullpage.jsプラグインセクションの位置要素

<html> 
    <head> 
     <script type="text/javascript"> 
    $(document).ready(function() { 
     $('#fullpage').fullpage({ 
      sectionsColor: ['#1bbc9b', '#f5fbfd'], 
      anchors: ['home', 'about'], 
       navigation: true, 
       scrollingSpeed: 850, 
       animateAnchors: true, 
       navigationPosition: 'right', 
       responsiveWidth: 900, 
        afterResponsive: function(isResponsive){ 

       } 
     }); 
    }); 
</script> 
    </head> 
<div id='fullpage'> 
    <div class="section" id="home"> 
     <div class='container '> 
       <img class='center-block index_logo img-responsive' style='position:relative; top:0;' src='<?php echo get_logo_by_lng();?>' /> 

     </div> 
    </div> 
    <div class="section" id="second"> 
     <div class='container'> 

       <img class='center-block index_logo img-responsive' style='position:relative; top:0;' src='<?php echo get_logo_by_lng();?>' /> 

     </div> 
    </div> 
</div> 

</html>

何？セクションに要素を配置する方法が分からないと思います。ありがとう

出典

2017-09-21 Jack

イメージがロードされていないため、スペースを必要としません。ロードすると、イメージは領域を占有します。 –

@SvenTheSurferしかし、私はロゴを使用していない場合はすべてが問題ありません – Jack

普通だと思いますが、FullPage.jsは書類を書式設定するまで少し時間がかかります。

いくつかのテスト（繰り返しRunをクリックしてください）：

With a logoとWith text、あなたも、テキストを見ることができます。

溶液をレンダリングFullPage.js後にフェード効果を作成することができる。

CSS

html { opacity:0; }

afterRender: function() { 
    $('html').animate({'opacity': 1}, 1000); 
}

The example

出典

2017-10-01 19:27:46 Baro

Fullpage.jsプラグインセクションの位置要素

答えて

関連する問題