结合 jquery 图像切换和滚动字幕脚本

发布于 2024-12-01 21:46:18 字数 784 浏览 1 评论 0原文

我正在尝试将(1)图像切换菜单(滚动菜单上的项目,让图像显示在页面上的其他位置)与(2)标题滚动(滚动图像,将标题扩展到显示更长的文本)。

标题翻转是可爱的 jCapSlide 脚本,下面是它的工作示例:

http://steph-morris .com/jCapSlide.html

(来自 http://tympanus.net/codrops/2009/ 11/23/jcapslide-a-jquery-image-caption-plugin/)

这是图像切换菜单完全无法显示标题的示例,在是否处于翻转状态:

http://steph-morris.com/novel_test.html 如果我将其从“ic_container”DIV 中删除并将其移动到“overlay”DIV 中,则此拼凑在一起的早期版本会设法显示标题。可悲的是我无法再复制这一点。这就是我喜欢破解别人脚本的原因,我修改得越多,就越能最终打破它!

希望您能提供任何指导,从“将两个脚本拼凑在一起 101”指南的说明,到使其正常工作的便捷解决方案。

I am trying to hack together (1) an image switch menu (roll over an item on the menu, have an image show up elsewhere on the page) with (2) a caption roll over (roll over the image, have caption expand to show longer text).

The caption roll-over is the lovely jCapSlide script, here's an example of it working:

http://steph-morris.com/jCapSlide.html

(original plug-in from http://tympanus.net/codrops/2009/11/23/jcapslide-a-jquery-image-caption-plugin/)

Here is an example of the image switch menu completely failing to show the captions, in roll-over state or not:

http://steph-morris.com/novel_test.html

An earlier version of this cobbling-together managed to get the caption displaying IF I removed it from the "ic_container" DIV and moved it into the "overlay" DIV. Sadly I can no longer replicate that. That's what I love about hacking other people's scripts, is with how much more finality I manage to break it the more I tinker with it!

Would appreciate any guidance, from directions to a "cobbling two scripts together 101" guide to a handy solution to getting this to work.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

静若繁花 2024-12-08 21:46:18

你的javascript大部分都很好,实际上问题出在你的css上。我删除了一些样式,现在第一个样式可以正常工作。您必须稍微尝试一下样式才能达到您想要的效果。至于第二个没有显示问题的是,由于某种原因,当 showcaption 选项设置为 true 时,javascript 出现问题。使其正常工作的解决方法是手动将“ic_caption”div 设置为 style="display:block;"。我不明白为什么它不起作用,但现在这样做可以让它在开头显示标题。

我在这里设置了一个工作示例: http://jsfiddle.net/dbMGg/1/

Your javascript is mostly fine actually the problem lies with your css. I stripped out some of the styles and it now works correctly for the first one. You're going to have to play around with the styles a bit to get it the way you want. As for the 2nd one not showing the issue is that for some reason the javascript is having problems when the showcaption option is set to true. A workaround to get it to work is to manually set the 'ic_caption' div to have style="display:block;". I couldn't figure out why it wasn't working but doing this now makes it show the caption at the beginning.

I set up a working example here: http://jsfiddle.net/dbMGg/1/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文