Блог

Я не хочу использовать пользовательский интерфейс jQuery, поэтому я попытался создать скрипт перетаскивания jQuery самостоятельно.

По сути, это мой код для горизонтального перетаскивания:

 var down = false;

$('#itemToMove').mousedown(function(e){
    down = true;
    left = event.pageX - $(this).offset().left;
});

$(document).mouseup(function(){
    down = false;
});

$(document).mousemove(function(e){
    if(down){
        var X = event.pageX - left;
        $('#itemToMove').css({
            left: X
        });
    }
});
  

Я просто потрясающе работаю в Chrome, но не в других браузерах (пробовал KHTML, Trident и Gecko).
Кто-нибудь может сказать мне, почему?

Я чертовски уверен, что если вы поместите предупреждение («») в обработчик события mousedown, оно никогда не сработает. Это потому, что к тому времени, когда вы пытаетесь привязать обработчик события к событию наведения курсора мыши на объект, объект (ваш div) еще не существует. Попробуйте обернуть весь ваш блок кода в

$(документ).готово(функция() { // Ваш код здесь });

Что-то вроде этого:

     var down = false;
    var left = 0;

    $(document).ready(function()
        {
        $('#itemToMove').mousedown(function(e)
            {
            down = true;
            left = e.pageX - $(this).offset().left;
            });

        $(document).mouseup(function()
            {
            down = false;
            });

        $(document).mousemove(function(e)
            {
            if(down)
                {
                var X = e.pageX - left;
                $('#itemToMove').css(
                    {
                    left: X
                    });
                }
            });
        });
  

Надеюсь, это поможет :]

Добавлено: Кроме того, убедитесь, что вы бегло просмотрели этот документ:http://api.jquery.com/ready, особенно в следующей части:

Примечание: Пожалуйста, убедитесь, что все таблицы стилей включены перед вашими скриптами (особенно те, которые вызывают функцию ready). Это позволит убедиться, что все свойства элемента правильно определены до начала выполнения кода jQuery. Невыполнение этого требования приведет к спорадическим проблемам, особенно в браузерах на основе WebKit, таких как Safari.