Question

我正在尝试显示当前和下一个幻灯片部分标题。到目前为止，目前的幻灯片标题工作得很好，但我似乎无法抓住下一张幻灯片的标题。

你会注意到在afterLoad函数中我正在调用nextIndex，当我滚动这些部分时，它会正确地用1,2,3等进行更新。但我无法获得实际的头衔。

提前致谢

//Variables
var deleteLog    = false;           
var currentTitle = jQuery('#current-title')
var nextTitle    = jQuery('#next-title')

// fullPage.js call
jQuery('#fullpage').fullpage({
  verticalCentered  : true,
  navigation        : true,
  navigationPosition: 'right',
  slidesNavigation  : true,
  slidesNavPosition : 'bottom',
  responsiveWidth   : 768,
  scrollBar        : true,
  afterRender  : function(){
  wow.init();   
  },    

  afterLoad: function(anchorLink, index) {
    var loadedSection = jQuery(this);
    var projectTitle  = jQuery('.section.active .project-title').html();
        if (deleteLog) {
           currentTitle.html('');
         }
         currentTitle.append(projectTitle);
           deleteLog = true;              
         },

  onLeave: function(index, nextIndex, direction) {
   var projectTitle = jQuery('.section.active .project-title').html();
   if (deleteLog) {
    nextTitle.html('');
   }
   nextTitle.append(nextIndex);
     deleteLog = true;
  },

我要删除的标题HTML，我想动态添加章节标题：

<p>
    <span id="current-title"></span> 
    <span id="next-title"></span></a>
</p>

我剥离后页内容HTML :(注意.active类，当你向下滚动到每个部分时，这当然会改变）

<div id="fullpage">

  <div class="section active">
    <h1 class="project-title post-title">Section Title One</h1>
  </div><!-- .section -->

<div class="section">
    <h1 class="project-title post-title">Section Title Two</h1>
  </div><!-- .section -->

<div class="section">
    <h1 class="project-title post-title">Section Title Three</h1>
  </div><!-- .section -->

</div><!-- #fullpage -->

使用jQuery获取下一个幻灯片标题（fullpage.js）

0 个答案: