jQuery Slide Stop в левом положении - PullRequest
Новая
       16

jQuery Slide Stop в левом положении

0 голосов
/ 05 мая 2011

Я позиционирую div для события mousemove, устанавливая его css в левом положении, демонстрацию которого можно найти по адресу:

http://jsfiddle.net/JLtT3/53/

Какие у меня проблемыwith устанавливает левую и правую границы для остановки.

Независимо от того, что я делаю, кажется, что он переходит границы (левые и правые), которые я установил, поэтому -13px влево.

Если я записываю левую позицию в firebug, она превращается в минус цифры, несмотря на то, что у меня есть:

if (sbar <0) </p>

в моем коде.

jQuery (рабочий пример, включая html по указанному выше URL): 

$(document).ready(function() {
    var statusbar = $(".jspDrag");

    statusbar.mousedown(function(event) {
        handleMouseDown(event, this);
    });

    $("body").mouseup(function(event) {
        handleMouseUp(event, this);
    });
});

function handleMouseDown(e, sbar) {
    var sbarPosition = $(sbar).position();
    var sbarPosition = e.pageX - sbarPosition.left;
    var endRightPosition = $('.jspCapRight').position();
    var endRightPosition = endRightPosition.left - $(sbar).width();
    var endLeftPosition = $('.jspCapLeft').position();
    var endLeftPosition = endLeftPosition.left;

    if (e.button == 0) 
    {
        $("body").bind('mousemove', function(event) {
            handleMouseMove(event, $(sbar), sbarPosition, endLeftPosition, endRightPosition);
        });
    }
}

function handleMouseUp(e, sbar) {
    $("body").unbind('mousemove');
}

function handleMouseMove(e, sbar, sbarMousePosition, endLeftPosition, endRightPosition) {
    var moveXposition = e.pageX - sbarMousePosition;
    var sbarLeft = $(sbar).position();
    var sbarLeft = sbarLeft.left;
    console.log(sbarLeft); //firebug

    if ((sbarLeft >= endLeftPosition) && (moveXposition < endRightPosition)) 
    {
        $(sbar).css('left', moveXposition);
    }
}

Ответы [ 2 ]

2 голосов
/ 06 мая 2011

Зачем изобретать велосипед?Пользовательский интерфейс jQuery имеет правильную перетаскиваемую реализацию, без неприятных ошибок, с которыми вам придется столкнуться самостоятельно, таких как перетаскивание, когда мышь покидает окно, случайный выбор текста, предотвращающий следующее перетаскивание, и т. д. Вы даже можете создать пользовательский интерфейс jQuery.файл на веб-сайте, если вам не нужно все это, чтобы сократить кодовую базу.Проверьте эту скрипку: http://jsfiddle.net/JLtT3/54/

Реализация с пользовательским интерфейсом jQuery: 

$(document).ready(function() {
    $(".jspDrag").draggable({
        containment: '.jspHorizontalBar',
        axis: 'x',
        drag: function(event,ui){
            //do your stuff, ui.position.left is the current position
        }
    });
});
1 голос
/ 06 мая 2011

Если это: 

if ((sbarLeft >= endLeftPosition) && (moveXposition < endRightPosition))

действительно так: 

if ((moveXposition>= endLeftPosition) && (moveXposition < endRightPosition)) {

?

Вы, похоже, проверяете, что текущая позиция (sbarLeft) не прошлалевая граница вместо новой позиции (moveXposition).

...