JQuery UI, Joomla и проблема сафари

Question

У меня есть ползунок jquery ui, который прокручивает содержимое div при перемещении, вот код:

    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);
            }
        });

    }

Это отлично работает в Firefox, но не в Safari / Chrome. Что происходит в Safari и Chrome, так это то, что ручка слайдера при загрузке страницы не существует до тех пор, пока вы не нажмете на направляющую ползунка, а когда она появится, ее нельзя будет перетащить, однако вы все равно можете прокручивать ее, нажимая вдоль направляющей ползунка.

Эта проблема, однако, проявляется только при использовании в CMS Joomla, за пределами этого CMS она прекрасно работает во всех браузерах. Weird.

У кого-нибудь были подобные проблемы? это было бы очень полезно, спасибо.

Answer 1

Joomla часто включает в себя mootools как способ помощи вам вместе с некоторыми простыми вещами javascript. Одна из больших проблем заключается в том, что при использовании jQuery псевдоним $ зарезервирован для mootools вместо jQuery. Вот несколько решений.

Вариант 1:

Если вы знаете, что вам все еще нужны mootools, измените код, вызывающий jQuery, чтобы использовать функцию jQuery () вместо $ () . Вот так:

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);
    }
});

Вариант 2:

Просто избавьтесь от mootools. Это исправление в PHP. Вы можете использовать его, чтобы помешать mootools выводить данные на веб-страницу (и впоследствии не мешать работе вашего jQuery.):

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