0

我正在尝试创建一个带有附加到每个导航项的唯一数据属性的菜单。单击时，我希望该导航项找到具有相同属性的部分并向其添加类。这是我迄今为止使用的代码（它是更大脚本的一部分）。

var $el = $( '#bl-main' ),
$sections = $el.children( 'section' ),
$navItems = $( 'nav > a' );   


$navItems.on( 'click', function( event ) {

$el.addClass( 'bl-expand-item' );
$navItems.find("[data-section='" + current + "']");
$sections.find("[data-section='" + $navItems + "']").addClass( 'expand expand-top' );
} );

这是它基于的脚本。http://tympanus.net/Development/FullscreenLayoutPageTransitions/

这个想法是添加一个单独的浮动导航来链接到不同的部分（而不是当前实现的直接单击展开）。我添加的当前脚本似乎只在点击时刷新页面。我根本无法让它在小提琴中工作，所以我确定原始脚本会起作用。粘贴关于我的部分已添加到我的本地文件中。

4

2 回答 2

0

在第一行，当您尝试调用一个<section>元素时，您在括号前缺少 jQuery 简写。那应该修复你的脚本。

所以它应该看起来像：

var $section = $('section');

那应该让你们都准备好继续！

于 2013-07-15T20:10:58.563 回答
0

首先，您在第一个变量分配中缺少 $ 。 var $section = $('section')

在那之后，如果没有看到你的标记，很难说出你想要做什么，但我会试一试。

您似乎正在尝试通过 nav > a 元素的 data-section 属性过滤 $section 对象。这段代码应该这样做：

var $section = $( 'section' ), $navItems = $( 'nav > a' );   

$navItems.on( 'click', function( event ) {
    var $navSection = $section.filter("[data-section='" + $( this ).data( 'section' ) + "']");
    $navSection.addClass( 'expand expand-top' );
    return false;
} );

请注意，我们正在通过单击锚的 data-section 属性的值过滤所有部分。

如果这没有帮助，请添加您的标记，以便我们查看您的结构。

于 2013-07-15T20:27:54.517 回答