jquery 滑块不适用于 jquery-1.6！

发布于 2024-11-06 12:15:36 字数 1040 浏览 3 评论 0原文

此滑块代码适用于旧版本的 jquery，例如 jquery-1.5。但当我尝试将它与最新版本的 jquery - jquery-1.6 集成时，它无法正常工作。

您可以在此处尝试 - 当您沿着滑块滑动时，内容不会滚动。当您前后拖动滑块时，内容应沿着滑块滚动。

这是一些代码，

function init_scrollbar ()
{
    //scrollpane parts
    scroll_frame = $('#scroll-frame'); // scroll-frame
    scroll_content = $('#scroll-content'); // scroll-content
    scroll_location_pixel = 0;
    original_location_scroll_handle = 0;
    original_width_scroll_content = scroll_content.width();

    scrollbar = $('#content-slider').slider({
        min: 0,
        animate: true,
        create: on_scrollcreate,
        change: on_scrollchange,
        slide: on_scrollslide
    });
}

我认为这是事件 slide 不起作用，这是代码，

function on_scrollslide(event, ui)
{
    var scroll_maximum = scroll_content.width() - scroll_frame.width();
    scroll_frame.attr({scrollLeft: ui.value * (scroll_maximum / 100) });
}

知道我做错了什么吗？你能告诉我如何修复它吗？

谢谢。

原文

This slider code works fine with older version of jquery, such as jquery-1.5. But it does not work properly when I tried to intergrate it with the latest version of jquery - jquery-1.6.

You can try it here - the content does not scroll when you along the slider. The content should be scrolled along the slider when you drag and move it forward and backward.

Here is some of the code,

function init_scrollbar ()
{
    //scrollpane parts
    scroll_frame = $('#scroll-frame'); // scroll-frame
    scroll_content = $('#scroll-content'); // scroll-content
    scroll_location_pixel = 0;
    original_location_scroll_handle = 0;
    original_width_scroll_content = scroll_content.width();

    scrollbar = $('#content-slider').slider({
        min: 0,
        animate: true,
        create: on_scrollcreate,
        change: on_scrollchange,
        slide: on_scrollslide
    });
}

I think it is the event slide does not work, here it is the code,

function on_scrollslide(event, ui)
{
    var scroll_maximum = scroll_content.width() - scroll_frame.width();
    scroll_frame.attr({scrollLeft: ui.value * (scroll_maximum / 100) });
}

Any idea what have I done wrong? can you tell me how to fix it?

Thanks.

分享到QQ

分享到微博

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

发布评论

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

通知家属抬走 2024-11-13 12:15:36

对于 jQuery 1.6：

从 jQuery 1.6 开始，.attr() 方法
对于以下属性返回未定义
尚未设置。此外，
.attr() 不应该用于普通
对象、数组、窗口或
文档。检索和更改 DOM
属性，使用 .prop() 方法。

这是一个工作小提琴。

回复收藏 0 原文

百善笑为先 2024-11-13 12:15:36

jQuery 现在可以通过新的 .prop() 正确区分属性和属性方法。

在 on_scrollslide 函数中，将 scroll_frame.attr({) 更改为 scroll_frame.prop({:

function on_scrollslide(event, ui)
{
    //var scroll_maximum = scroll_frame.attr("scrollWidth") - scroll_frame.width();
    var scroll_maximum = scroll_content.width() - scroll_frame.width();

      // change---vv
    scroll_frame.prop({scrollLeft: ui.value * (scroll_maximum / 100) });
}

jQuery is now properly distinguishing between attributes and properties with its new .prop() method.

In the on_scrollslide function, change scroll_frame.attr({ to scroll_frame.prop({:

function on_scrollslide(event, ui)
{
    //var scroll_maximum = scroll_frame.attr("scrollWidth") - scroll_frame.width();
    var scroll_maximum = scroll_content.width() - scroll_frame.width();

      // change---vv
    scroll_frame.prop({scrollLeft: ui.value * (scroll_maximum / 100) });
}

回复收藏 0 原文