ui-slider-handle not sliding [closed]

Question

Modularity theme http://pobyworld.com I replaced the default slider handle in the content slider with a red arrow image. It worked perfectly for 2 years. Suddenly the arrow no longer slides through the thumbnail slider. Here's the css

#content-slider {width: 930px; height: 10px; z-index:1; margin-left:10px; position: relative; -moz-border-radius:4px;-webkit-border-radius:4px}

.ui-slider-handle { background: url(/wp-content/uploads/2010/05/arrow.png) no-repeat; height: 16px; width: 32px; overflow: hidden; position: absolute; top: -3px;margin-left:-10px;}

The js:

if ($(".ui-slider-handle", this.element).length == 0)
        $('<a href="#"></a>')
            .appendTo(this.element)
            .addClass("ui-slider-handle");

    if (o.values && o.values.length) {
        while ($(".ui-slider-handle", this.element).length < o.values.length)
            $('<a href="#"></a>')
                .appendTo(this.element)
                .addClass("ui-slider-handle");
    }

    this.handles = $(".ui-slider-handle", this.element)
        .addClass("ui-state-default"
            + " ui-corner-all");

Any ideas why it may have stopped working? Thank you ever so much!

Answer 1

Have you added plugins recently? You have a javascript conflict, I'm guessing it's due to the use of $ instead of jQuery. I see you're also loading the prototype and scriptaculous libraries which may be the source of the conflict.