2016-05-31 51 views
1

简单介绍一下,我创建了一个网站,其中我在移动设备上水平定位了3个div(请参见下图),在Bootstrap的旋转木马的帮助下完成并在顶部添加了滑动功能从avinoamr的回购:https://github.com/avinoamr/bootstrap-carousel-swipe链接到水平网页上的部分

bootstrap with swipe

现在的问题是,我想通过点击“TAB1”添加功能“ TAB2”,顶部菜单中的“TAB3”按钮才能到在同一页上的各个div使用href#:

<li class="col-sm-4"> <a href="#tab2">Tab2</a> </li> 

......像这样一个的div:

<div id="tab2" class="item active"> 
    <div class="col-sm-12 yellow" id="yellow"> 
    </div> 
    </div> 

...但由于某些原因,它不触发跳转。任何想法?

你可以看到原来的语法在这里: https://jsfiddle.net/wmvx1p9t/2/

回答

2

只是用id属性不会自动触发引导转盘改变位置。 的carousel documentation定义了两种方法可以触发转盘滚动:

  • Via data attributes:通过添加data-slide属性的标签锚。您的标签锚必须位于传送带<div>内才能使用。
  • Via JavaScript:您可以将点击事件监听器到标签锚和使用手动触发转盘循环到相应的项目:$('.carousel').carousel(number)
+0

事件侦听器的完美! 我添加: “的onclick =” swipeFunction(0) “ ”在标签上,并且: “ 功能swipeFunction(索引);” jQuery中:) –

+0

{ $圆盘传送带(指数) ( '转盘。')}现在我遇到了相反的问题(我讨厌自己做小白菜),并且无法让它工作。对于那些有兴趣,请看看这里: http://stackoverflow.com/questions/37567531/make-current-div-change-relevant-menu-tab-to-active –