水平和垂直双向触摸滑动滑块

有很多JavaScript或CSS触摸滑动滑块，但它们都似乎只允许垂直或水平滑动滑动。那里有什么东西可以放在一张幻灯片上，所以我可以在一张幻灯片上水平和垂直滑动？水平和垂直双向触摸滑动滑块

2012-10-24 iwek

任何这方面的更新？你有没有发现这种行为的任何滑块？ – briler

@briler我立即想到了[idangero.us swiper]（http://www.idangero.us/sliders/swiper/），但是在答案中已经提到了这一点。你能更详细地描述你需要什么吗？我无法概念化你正在寻找的东西。谢谢。 –

我不是100％肯定，如果这是你在找什么，但看起来织补接近：

iDangero.us组队，探索。

http://www.idangero.us/sliders/swiper/

允许另一水平圆盘传送带/滑内垂直swping框。我一直在寻找同样的东西，这是我发现的最接近的插件。有点黑客/操纵可能会使它做你想要的。

来源

2012-10-26 16:58:06

谢谢，这实际上是我开始的，但它只支持/或不支持水平和垂直滑动在一张幻灯片上。 – iwek

不错！它会有触摸行为（点击，双击等），它会绝对完美！ – Ben

如this demo page所示，您可以使用fullPage.js完全按照您的描述进行滑动操作。

我与fullPage.js唯一的问题是缺乏1：1的触摸运动。因此，只要您将手指放在屏幕上，就不必控制滑动，脚本具有一个可配置的变量，表示一旦满足了屏幕高度/宽度的百分之X的阈值滑动。这种方法很有效，但并不像RoyalSlider那样有1：1的触摸动作;所以如果你只用49％的方式在同一部分上进行滑动。这就是说fullPage.js有很好的支持（IE8 +）并定期更新。

理想情况下，我希望fullPage.js为have 1:1 touch movement，作者可以提出请求，但现在我对JavaScript的知识太过基本，无法实现这样的功能。

我正在考虑的一个选项是使用两个滑块相互组合。我将使用RoyalSlider进行左右滑动（因此您可以获得1：1的良好触摸效果），并使用fullPage.js进行垂直向上效果。

来源

2014-03-05 12:50:07 patrickzdb

这里是clreating水平和垂直滑块

<script> 
function MM_effectSlide1(targetElement, duration, to, from, slide, toggle) 
{ 
    Spry.Effect.DoSlide(targetElement, {duration: duration, to: to, from: from, horizontal: true, toggle: true}); 
} 
function MM_effectSlide2(targetElement, duration, to, from, slide, toggle) 
{ 
    Spry.Effect.DoSlide(targetElement, {duration: duration, to: to, from: from, horizontal: false, toggle: true}); 
} 
</script> 

<body> 
    <div id="socialmedia" class="socialcontainer" onclick="MM_effectSlide1('socialmedia', 1000, '100%', '11%', true, true)"></div>

的一个简单的方法。如果你看一下代码，应该改变的是MM_effectSlide1，2，3只有代码，等等

来源

2014-12-23 09:47:23 andre

水平和垂直双向触摸滑动滑块

回答

相关问题