如何在 scriptaculous 中运行出现效果和淡入淡出效果?我需要它们串联运行,这样就没有其他效果可以插入其中
我已经摆弄这个问题好几个小时了,但就是无法把它做好。首先,我的网站已经在使用 Prototytpe 和 Scriptaculous,并且更改需要很长时间。
基本上我是在实现类似于 jQuery Cycle 插件的幻灯片效果之后。我已经写了大部分内容,但无法克服这个障碍:
我需要用户能够按下一个控制按钮,该按钮将跳过幻灯片到他们选择的任何一张。我的问题是,如果正在运行淡入淡出/出现效果,则会导致重叠。
我正在使用队列,它们在自己的范围内。我看到的问题是一张幻灯片上的淡入淡出效果和下一张幻灯片上的显示效果是单独的功能。这意味着,如果用户在动画处于淡入淡出和淡入淡出之间时单击控制按钮移动到另一张幻灯片,出现,那么下一个周期将把自己插入到这两个效果之间的队列中。默认是附加到现有队列的末尾,这应该没问题。但是,如果在实例化新的淡入淡出时尚未添加外观,则队列会混乱。
我可以做到这样,如果动画有效,则不会发生任何事情,但这不是我想要的效果。我希望能够单击一张幻灯片,无论发生什么,都能有效地停止并出现下一张幻灯片。
这是我所追求的示例: http://www.zendesk.com/
抱歉,如果这没有道理。这是一个很难解释的问题。
Ive been fiddling with this for hours and hours and just cant get it right. First off my sites are already using Prototytpe and Scriptaculous, and to change would take a long time.
Basically I am after achieving a slideshow effect similar to jQuery Cycle plugin. I have written most of it but cant get over this hurdle:
I need the user to be able to press a control button which will skip the slide to which ever one they have picked. My problem is that if a fade / appear effect is running, then it causes an overlap.
I am using queues and they are in their own scope. The problem as I see it is that the fade effect on one slide and the appear effect on the next slide are separate functions. Which means that if the user clicks the control button to move to another slide whilst the animation is inbetween fade & appear, then the next cycle will slot itself in the queue between those 2 effects. The default is to append to the end of the existing queue, which should be fine. But if the appear hasnt been added when a new fade is instantiated, then the queue messes up.
I can make it so nothing happens if animation is in effect but thats not the effect I am after. I want to be able to click a slide and whatever is happening to effectively stop and the next slide appear.
This is an example of what I am after: http://www.zendesk.com/
Im sorry if that doesnt make sense. Its a tough one to explain.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
如果你在lib中没有找到任何东西,你可以只使用DOM和一些JS,就像这个问题一样: How do you make some things to come Slowly在使用 Javascript 的页面上?
If you don't find anything by the lib you can just use the DOM and some JS like in this question: How do you make something to appear slowly on a page using Javascript?
昨晚我设法解决了自己的问题。
我已经尝试过这个但无法让它正常工作。我所做的只是添加了一个标志变量,如果任何动画正在运行(var running = true; [或 false]),则该标志变量为 true
如果用户单击寻呼机按钮移动幻灯片(假设从幻灯片 1 到幻灯片 4),并且如果幻灯片已经在运动(然后 var running == true),则代码会查找系统中所有排队的效果,删除它们,然后隐藏所有幻灯片。然后,按照用户的请求,它开始一个新的循环到幻灯片 4。
无论您现在单击寻呼机按钮的速度有多快,它都可以无缝运行。 :)
I managed to fix my own problem last night.
I had already tried this but couldn't get it to work right. All I done was added a flag variable which is true if any animation is running (var running = true; [or false])
If the user clicks the pager buttons to move the slide (lets say from slide 1 to slide 4), and if the slide is already in motion (then var running == true), then the code finds all queued effects in the system, deletes them, and then hides all the slides. It then just starts a new cycle to slide 4, as the user requested.
Doesn't matter how fast you click the pager buttons now, it works seamlessly. :)