I've got a jquery ui slider in position which scrolls this content of the div when moved, here's the code:

    var paraHeight = $("#descPara").height();
    var maxScroll = paraHeight - 250;
    var activeScroll;
    if (maxScroll <= 0){

        //do nothing    

    } else {

        $("#slider2").slider({

            orientation: "vertical",
            min: 0,
            animate: true,
            max: maxScroll,
            value: maxScroll,
            slide: function(event, ui) {
                $("#descPara").stop().animate({'bottom': (-ui.value + maxScroll) + 'px'}, 1000);
            }
        });

    }

This works fine in Opera although not in Safari/Chrome. What goes on in Safari and Chrome is, the handle from the slider once the page loads is non existent before you click the slider rail so when it will appear it can't be pulled, hower you are able to still scroll by clicking across the slider rail.

This issue however is just apparent when utilized in the content management systems joomla, outdoors of the content management systems it really works perfectly in most browsers. Strange.

Has anybody had any similar problems? it might be really useful, thanks.

Joomla frequently includes mootools as a means of helping you along withs some simple javascript stuff. Among the large difficulties with this really is that after using jQuery the $ alias is restricted to mootools rather than jQuery. Listed here are a couple of solutions.

Option 1:

Knowing you'll still need mootools, modify your code calling jQuery to make use of the jQuery() function rather than $(). Like so:

var paraHeight = jQuery("#descPara").height();
...
jQuery("#slider2").slider({
    orientation: "vertical",
    min: 0,
    animate: true,
    max: maxScroll,
    value: maxScroll,
    slide: function(event, ui) {
        jQuery("#descPara").stop().animate({'bottom': (-ui.value + maxScroll) + 'px'}, 1000);
    }
});

Option 2:

Just eliminate mootools. This can be a fix in PHP. Technology-not only to help keep mootools from getting output to the net page (and subsequently from disturbing your jQuery.):

<?php
$user =& JFactory::getUser();
if ($user->get('guest') == 1) {
    $headers = $this->getHeadData();
    $headers['scripts'] = array();
    $this->setHeadData($headers); 
}
?>