gpt4 book ai didi

javascript - fullpage.js 中水平导航栏上带有点的标题

转载 作者:行者123 更新时间:2023-12-03 10:54:21 26 4
gpt4 key购买 nike

我正在使用 fullpage.js 设计网站。我想为水平导航栏中的每个点赋予标题。

function addSlidesNavigation(section, numSlides){
section.append('<div class="fp-slidesNav"><ul></ul></div>');
var nav = section.find('.fp-slidesNav');

//top or bottom
nav.addClass(options.slidesNavPosition);

for(var i=0; i< numSlides; i++){
nav.find('ul').append('<li><a href="#"><span></span></a></li>');
}

//centering it
nav.css('margin-left', '-' + (nav.width()/2) + 'px');

nav.find('li').first().find('a').addClass('active');
}

函数调用来自:

if(options.slidesNavigation){
addSlidesNavigation($(this), numSlides);
}

该函数生成水平导航栏。我想为每个添加标题。我不明白我该怎么做。请帮忙。

最佳答案

我是按照下面的方式做到的。

在索引页中:horizo​​ntalNavigationToolTip = ['tooltip1','tooltip2'],

在 jquery.fullpage.js 中:

function addSlidesNavigation(section, numSlides){
section.append('<div class="fp-slidesNav"><ul></ul></div>');
var nav = section.find('.fp-slidesNav');

//top or bottom
nav.addClass(options.slidesNavPosition);

for(var i=0; i< numSlides; i++){
//nav.find('ul').append('<li><a href="#" title="'+ tooltip[i] +'"><span></span></a></li>');

// Only add tooltip if needed (defined by user)
var tooltip = options.horizontalNavigationToolTip[i];

var li = '<li><a class="tooltips" href="#"><span></span><div><img src="images/tooltip/'+ tooltip +'.png" /></span></div></a>';
li += '</li>';

nav.find('ul').append(li);
}

//centering it
nav.css('margin-left', '-' + (nav.width()/2) + 'px');

nav.find('li').first().find('a').addClass('active');
}

希望这对其他人有帮助。

关于javascript - fullpage.js 中水平导航栏上带有点的标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28318492/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com