更改按钮属性以匹配滑块窗口答案

【问题标题】：Changing Button Attributes to Match Slider Window更改按钮属性以匹配滑块窗口
【发布时间】：2010-04-21 16:32:56
【问题描述】：

你好，

首先 - 这个网站令人难以置信。我在这里学到了很多很棒的东西！

我正在使用基于 jquery 的滑块程序来显示一系列图片（一系列书籍）。在滑块窗口下方，我放置了一个“PDF”按钮。我正在尝试排序如何让按钮下载与当前显示在滑块框中的任何图像相关联的文件。因此，如果“图片#3”显示在滑块窗口中，我需要 PDF 按钮与相应的#3 文件相关联。我相信我需要动态更改每个按钮的属性以匹配滑块窗口中显示的内容。

您可以通过beta查看测试版网站

我怀疑我需要某种 javascript 来捕捉点击事件并将其提供给按钮的属性。这就是我颤抖的腿可以用这个支撑我的程度。谁能指出我正确的方向？我是一个真正的菜鸟，学习缓慢，所以用小词！

干杯， TY

【问题讨论】：

标签： javascript jquery jslider

【解决方案1】：

你在正确的轨道上。我认为这可能会起作用，但我不习惯从 jQ 元素的数组中剔除。

将文件名放入列表项中的alt 标记中，然后使用此脚本：

$('#download-button').click( function() {
    var left_pos = $('ul').css('left');
    var win_width = $('ul').innerWidth();

    left_pos = left_pos * (-1)  /* Will convert from negative to positive */

    var slide_num = left_pos/win_width;
    var slides = $('ul').find('li');        

    $(this).attr('src', 'path/to' + slides[slide_num].attr('alt'));
});

此外，在玩滑块时检查活动 DOM 时，我注意到如果您在幻灯片的结尾/开头改变方向，它似乎会跳动一点。您可能想对此进行调查

【讨论】：

好的——我开始拼接，看看会发生什么；我看到了你写出来的逻辑。是的，我也注意到了跳跃点……还不确定是什么原因造成的。我有一种感觉，这是我代码某处的错字。干杯 - TY
好吧，我尝试了很多次才能让它工作......不高兴。我认为问题之一是 jSlider 本身 - 很难获得事件句柄，并且由于存在问题以及库冲突，我选择切换到 jQueryTools。我使用他们的“可滚动”和“标签”脚本创建了一个时髦的幻灯片。您可以在窗格中嵌入 DIV，并且很容易添加事件 - 有很多句柄，我能够制作动态按钮。也不再有 javascript 库冲突。再次感谢您的帮助！！！