Tag: jquery cycle

幻灯片上的文本动画的jQuery循环

我正在尝试找到一种方法来为幻灯片的每张幻灯片设置图像标题和标题的动画，并将其动画效果与幻灯片放映同步。 即，一旦幻灯片切换效果结束，标题从右向左移动，标题从上到下，当幻灯片切换效果启动时，整个文本将在幻灯片淡出的同时淡出，让新的幻灯片和文字淡入。 我想出了如何使用.animate（ http://jsfiddle.net/S8F9Y/ ）使我的图像标题和标题移动： var $j = jQuery.noConflict(); $j(document).ready(function() { // Get the slideshow options var $slidespeed = parseInt( meteorslidessettings.meteorslideshowspeed ); var $slidetimeout = parseInt( meteorslidessettings.meteorslideshowduration ); var $slideheight = parseInt( meteorslidessettings.meteorslideshowheight ); var $slidewidth = parseInt( meteorslidessettings.meteorslideshowwidth ); var $slidetransition = meteorslidessettings.meteorslideshowtransition; var $captionduration = $slidetimeout – ($slidespeed*2); $j(‘.meteor-slides h1′).delay($slidespeed).animate({left: ’30’,opacity: 1}, 600, […]

在jQuery Cycle插件中单击时暂时禁用下一个/上一个按钮（链接）（不一定是jquery循环问题）

我需要阻止点击链接，比如让我们说2秒钟。 这是一个例子http://jsbin.com/orinib/4/edit 当您查看渲染模式时，您会看到下一个和上一个链接。 当您单击下一步时，它会以良好的过渡进行滑动。 但是，如果多次单击，则没有转换类型，这是预期的。 但我的问题是：这是如何防止点击下一个链接约2秒（或转换发生所需的时间），以便无论发生什么样的转换。 这是我试图使用的，但没有用： function(){ var thePreventer = false; $(“#next”).bind($(this),function(e){ if(!thePreventer){ thePreventer = true; setTimeout(function(){ thePreventer = false; }, 2000); }else{ e.preventDefault(); } }); } 我从哪里获得点击后暂时“禁用”链接？ 我认为。 我相信我无法通过此代码实现此效果（尽管它适用于其他链接）。 我相信这是因为循环插件获得了该链接，我知道我必须绑定/挖掘插件的这个function。 请注意：这段代码可能无法正常工作我只是用它来表明我尝试了它并且它不起作用，你可以重复使用它，如果你必须或给我你自己的东西。 如果可以的话请帮忙。 编辑 ：正如mrtsherman提出的这个简单而优雅的答案 ： http ： //jsfiddle.net/LCWLb 。

jQuery循环插件，每个幻灯片具有不同的超时值

我正在尝试使用jQuery循环插件循环不同的引号。 我希望根据报价的长度显示不同时间的报价。 为了达到这个目的，我得到内容管理系统输出秒数，因为类名如dur13将持续13秒。 这是我的非工作尝试： $(‘.featureFade’).cycle({cycleTimeout: 10, after: onCycleAfter}); function onCycleAfter() { $(‘.featureFade’).cycle(‘pause’); var duration = $(this).attr(‘class’).substring($(this).attr(‘class’).indexOf(‘dur’)+3) setTimeout(oncycleEnd, duration * 1000); } function oncycleEnd() { $(‘.featureFade’).cycle(‘resume’); } 这可能与周期有关吗？ 如果没有，是否有另一个插件可以工作？ 我真的不需要花哨的效果，只是淡出淡出就足够了。 非常感谢

Jquery禁用“下一步”按钮，直到动画结束

这很酷，我对此很熟悉。 但是我希望下一个和上一个按钮保持可见，只是不能点击。 在我的特殊情况下，按钮是图像，是设计的一部分。 我只是希望用户在动画结束前无法点击。

jquery循环插件，嵌套幻灯片，’后’选项或测试第一张和最后一张图像

在我的嵌套幻灯片中，我有’上一页’和’下一页’控件。 如果您在第一张幻灯片上，我希望能够减少’prev’的css不透明度，如果您在最后一张幻灯片上，我希望能够降低’next’的css不透明度。 ‘after：onAfter’选项已经足够了但是当放置在嵌套幻灯片控件的代码中时它似乎不起作用。 有没有办法在嵌套幻灯片中正确实现’after’，或者在嵌套幻灯片中测试第一个和最后一个图像？ 谢谢 这是我的代码。 $(document).ready(function() { // init and stop the inner slideshows var inners = $(‘.inner-slideshow’).cycle().cycle(‘stop’); var slideshow = $(‘#slideshow’).cycle({ fx: ‘fade’, speed: ‘fast’, timeout: 0, pager: ‘#nav’, pagerAnchorBuilder: function(idx, slide) { // return sel string for existing anchor return ‘#nav li:eq(‘ + (idx) + ‘) a’; }, before: function() { // […]

动画jQuery Cycle幻灯片的内容

每张幻灯片都由一个标题框和一个图像组成。 First title Second title 我正在尝试在每张幻灯片中添加一个辅助动画，以便标题框开始滑离图像，同时整个幻灯片移开（使用Cycle默认动画）。 想要的效果在ibm网站主页（http://www.ibm.com）中可见。 我试图在’和’之前’使用Cycle的回调’： $(document).ready(function() { $(‘#slideshowWindow’).cycle({ fx: ‘scrollHorz’, timeout: 5000, after: onAfter, before: onBefore }); }); function onAfter(cycle) { $(“.slideTitle”).delay(200).animate({marginLeft:”10px”}, 200 ); }; function onBefore(cycle) { $(“.slideTitle”).animate({marginLeft:”-400px”}, 100 ); }; 但是这样第二张幻灯片的标题在第一张幻灯片滑落时已经可见，因为回调都应用于两个标题。 所以我无法弄清楚如何让第一个消失，第二个进入（或只是保持静止）并行。

切换到另一个选项卡后，jQuery循环插件停止滑动

我正在使用带有以下设置的jquery循环插件。在给定的时间内滑动没有问题但是如果我点击浏览器的另一个选项卡并等待10 sn然后回到幻灯片的选项卡，我看到幻灯片停止。 它没有通过下一张照片。 什么可能导致这个问题？ var slideShow = $(‘.slideshow-container’).cycle({ fx: ‘fade’, timeout: 3000, speed: 500, fastOnEvent: 1, skipInitializationCallbacks: true, pause: 1 }); 我正在使用jQuery 1.6.2和循环版本2.9995（最新）。 你可以在jsfiddle.net上测试它

jQuery Cycle插件 – 暂停/恢复奇怪的行为

我有一个幻灯片运行与令人敬畏的循环插件，当你点击节目中的一个按钮，我在页面上显示一个隐藏的图层，并发送’暂停’命令循环。 我有两个问题： 当收到暂停命令时，循环立即翻转回序列中的第一张幻灯片（为什么??），并且没有点击我之前/之后的回调。 关闭图层后，我发送’resume’命令进行循环。 幻灯片继续播放（从第一张幻灯片开始，暂停离开它），但现在循环根本不会调用我之前/之后的回调，即使幻灯片显示进展。 所以我想我的问题是：如何才能正确暂停/恢复幻灯片放映，以免出现这些奇怪的行为？ （并且为了完全清楚并避免任何混淆，这不是关于“暂停hover”function，这实际上对我来说工作正常。:-) 这是我的cycle（）init和我的回调函数。 （为什么我要手动跟踪nextSlide，你问？因为当前幻灯片的内置值没有为前/后回调正确更新。） $(document).ready(function() { $(‘#slideshow’).cycle({ fx: ‘fade’, // choose your transition type, ex: fade, scrollUp, shuffle, etc… timeout: 4000, // milliseconds between slide transitions (0 to disable auto advance) speed: 1000, // speed of the transition (any valid fx speed value) pause: 1, // true to enable “pause […]

jQuery循环幻灯片resize问题

在这个页面上，我在中间有一个100％宽度的闪屏，它每8秒旋转一次图形图像。 我在这张幻灯片中有3个div。 主div包含幻灯片，内部div具有转发器背景图像，内部div包含渐变图像。 问题1.当你试图让浏览器变小……网站内容自我调整并在左侧移动…..但是我的幻灯片内容没有…目前我没有内容，但你可以通过黑色边框看到这一点。 幻灯片放在中间。 我该如何解决这个问题？ 问题2.浏览器宽度较小并加载此页面后….幻灯片放映在中心。 现在最大化浏览器，您将看到因为幻灯片显示在较小的屏幕上….它将在侧面留下空白区域而div不会随浏览器resize。 我反对这一点，所以任何帮助和建议都是受欢迎的。

有什么方法可以让jQuery循环在到达结束或开始时不循环？

我意识到插件被称为CYCLE，因为它循环了列表的元素。 但我最喜欢它的是它的灵活性，所以我想知道是否有任何方法可以使插件不循环。 因此，如果您尝试在第一张幻灯片上转到上一张幻灯片，或者在最后一张幻灯片时转到下一张幻灯片，它就会停止。 我一直在阅读选项和代码，但无法找到解决方案