具有动态上一个/下一个内容的jQuery滑块的最佳方法? [英] best approach for jQuery slider with dynamic prev/next content?
问题描述
这是一个有点复杂的难题，我很乐意就别人如何处理这个问题提供一些反馈.
Here's a somewhat complex puzzle, I'd love some feedback on how others would approach this.
该网站基本上是一个免费的区域新闻博客.底部的图像演示了布局(忽略日期重叠故障).它是用PHP，jQuery和xajax编码的.
This site is basically a free regional news blog. The image at the bottom demonstrates the layout (ignore the date overlap glitch). It's coded in PHP, jQuery and xajax.
我的问题与动态内容加载有关.照原样，在页面加载时，我将箭头分配给上一篇/下一篇文章的URL.没问题.这些URL非常友好，页面重新加载到下一篇文章，我可以整天循环浏览它们.
My question has to do with dynamic content loading. As is, on page-load, I assign the arrows to the URL of the prev/next articles. No prob. The URLs are friendly, the page reloads to the next article, and I can cycle through them all day long.
但是... 我想将箭头变成滑块(而不是href)，其行为如下:
But ... I'd like to turn the arrows into a slider (not an href) with the following behavior:
点击向右箭头...
- 开始通过xajax在屏幕外加载新内容
- 使旧内容向左滑动(从屏幕上移至屏幕外) 与新内容齐平也向左滑动(从屏幕外移至 屏幕上).
- Begin loading the new content offscreen via xajax,
- Cause the old content to slide left (from onscreen to offscreen) flush with the new content also sliding left (from offscreen to onscreen).
为什么?滑块很棒，我认为它会很专业.这是基本的滑块内容(例如 此jQuery scrollLeft滑块 )，但点击箭头即可动态加载内容，这引发了一些问题:
Why? Sliders are awesome, and I think it would look pro. And this is basic slider stuff (like this jQuery scrollLeft slider) except with content being dynamically loaded on click of the arrow, which raises some questions:
- 什么是最好的方法?
- 我是否使用PHP预先填充所有空的隐藏文章DIV?
- 我是否使用jQuery在每次单击箭头时附加/添加/删除文章DIV?
- jQuery的"scrollLeft"偏移量是什么样的?内容DIV是静态宽度，但最好使用 jQuery scrollTo ?
我希望我的问题很清楚...任何建议将不胜感激！
I hope my question is clear ... Any suggestions would be most appreciated!
推荐答案
这是我想出的解决方案.
Here's the solution I came up with.
如果有人对如何清理或收紧它有想法，请告诉我！
If anyone has ideas on how to clean it up or make it tighter, please let me know!
非常感谢@Jamie向正确的方向前进！
Many thanks to @Jamie for the push in the right direction!
这篇关于具有动态上一个/下一个内容的jQuery滑块的最佳方法?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
