我需要根据年份在时间轴中隐藏和显示元素。
假设在 2015
年使用点击,那么它应该隐藏它的所有子元素并在用户再次点击同一年 2015
时显示它。
我根据我的设计修改了以下 HTML 和 CSS,原始脚本可以在这里找到 http://codyhouse.co/gem/vertical-timeline/
我已经设置了 fiddle http://jsfiddle.net/6nvumkxc/2/
当我点击年份时,它只隐藏第一个元素,而不是该特定年份 block 中的所有 cd-timeline-block
。
最佳答案
那是因为你在当前上下文中使用了 .next()
。它只会针对下一个第一个 sibling ,而不是所有 sibling 。您需要将点击处理程序修改为:
$('.cd-year').click(function(){
$(this).parent().find('.cd-timeline-block').slideToggle();
});
或
$('.cd-year').click(function(){
$(this).nextAll().slideToggle();
});
或
$('.cd-year').click(function(){
$(this).siblings().slideToggle();
});
更新:只保留第一年选项:
$('.cd-year').click(function(){
$(this).nextAll().slideToggle();
}).not(':first').click();
关于javascript - 在点击事件中隐藏和显示点击元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29204776/