【问题标题】:swipeJS - bug using anchor linksswipeJS - 使用锚链接的错误
【发布时间】:2014-05-02 18:42:36
【问题描述】:
我已经尝试搜索谷歌并阅读了 SwipeJS 的 Github 上几乎所有的问题和问题,但我真的找不到任何解决我的问题的方法。
SwipeJS:
https://github.com/bradbirdsall/Swipe
问题:
我正在尝试使用锚链接直接跳转到 SwipeJS 内容滑块中的特定幻灯片。 (href="#thirdslide")
这可行,但问题是 SwipeJS 现在将新幻灯片视为第一张幻灯片,并且 .prev() 函数不允许我返回。 .next() 函数有效,但一直进入空白幻灯片。
有人知道我可以如何解决这个问题(简单)吗?
我对使用 Javascript 编程比较陌生,所以如果这是一个愚蠢的问题,请原谅。
【问题讨论】:
标签:
javascript
jquery
anchor
swipe
【解决方案1】:
(function() {
// when you click the link w/ a class of 'linkage'
$('.linkage').click(function() {
// scroll to the DIV w/ an ID of 'three'
$.scrollTo( '#three', 800, {easing:'swing'} );
// highlight the DIV using jQuery UI effect
$('#three').effect('highlight', {}, 3000);
});
});
给出一个scrollTto 不存在的错误。
删除它并将其用作按钮
<a href="#" class="linkage" onclick="slider.slide(3, 100)return false;">Linkage</a>
【解决方案2】:
我其实也有同样的问题。
我正在使用相同的脚本,并且试图从一些锚链接链接到特定幻灯片。
有人可以发布指向工作演示或 JSFiddle 的链接吗?
将不胜感激。
我的 HTML 是
<div id="timeline">
<ul id="dates">
<li class="on">2000</li>
<li><a href='#'>2002</a></li>
</ul>
<div class="swipe" id="slider">
<ul class="swipe-wrap" id="issues">
<li class="slide1" id="2000">
<h1>2000</h1>
<p>Donec semper quam scelerisque tortor dictum gravida. In
hac habitasse platea dictumst. Nam pulvinar, odio sed
rhoncus suscipit, sem diam ultrices mauris, eu consequat
purus metus eu velit. Proin metus odio, aliquam eget
molestie nec, gravida ut sapien. Phasellus quis est sed
turpis sollicitudin venenatis sed eu odio. Praesent eget
neque eu eros interdum malesuada non vel leo. Sed fringilla
porta ligula.</p>
</li>
<li class="slide2" id="2002">
<h1>2002</h1>
<p>Donec semper quam scelerisque tortor dictum gravida. In
hac habitasse platea dictumst. Nam pulvinar, odio sed
rhoncus suscipit, sem diam ultrices mauris, eu consequat
purus metus eu velit. Proin metus odio, aliquam eget
molestie nec, gravida ut sapien. Phasellus quis est sed
turpis sollicitudin venenatis sed eu odio. Praesent eget
neque eu eros interdum malesuada non vel leo. Sed fringilla
porta ligula.</p>
</li>
<li id="three">
<h1>2005</h1>
<p>Donec semper quam scelerisque tortor dictum gravida. In
hac habitasse platea dictumst. Nam pulvinar, odio sed
rhoncus suscipit, sem diam ultrices mauris, eu consequat
purus metus eu velit. Proin metus odio, aliquam eget
molestie nec, gravida ut sapien. Phasellus quis est sed
turpis sollicitudin venenatis sed eu odio. Praesent eget
neque eu eros interdum malesuada non vel leo. Sed fringilla
porta ligula.</p>
</li>
</ul>
</div>
</div>
【解决方案3】:
没关系,我在 onclick 事件上有一个愚蠢的错字。像魅力一样工作。
<li><a href="#" onclick='slider.slide(1,300);return false;'>2002</a></li>