Событие mouseup

Есть такой код

    swipes: function (status) {
        if (status) {
            this.bindTo( this.elem('view'), 'mousedown', this._swipeStart );
            this.bindTo( this.elem('view'), 'mouseup', this._swipeEnd );
        }
    },

    _swipeStart: function (e) {
        console.log(e);
        this._tmpSwipeStart = e.pageX;
    },

    _swipeEnd: function (e) {
        console.log(e);
        if ((e.pageX - this._tmpSwipeStart) > 50) {
            this.previous();
        }
        if ((e.pageX - this._tmpSwipeStart) < -50) {
            this.next();
        }
    },

Событие на mouseup не срабатывает. Не могу понять в чём дело.

9 years ago

belozer

а нет... Срабатывает. Но при перетаскивании мыши в нажатом состоянии - нет. Думаю нужно сделатьuser-select: none или что-то подобное

9 years ago

belozer

сделал, вот решение (думаю сделать реализацию более качественной)

        if (status) {
            this.bindTo( this.elem('view'), 'mousedown', this._swipeStart );
            this.bindTo( this.elem('view'), 'mouseup', this._swipeEnd );
            this.elem('view').on('dragstart', function(e) { e.preventDefault(); });
        }

9 years ago

apsavin

Почему вы используете mousedown/mouseup, а не pointer events? Вам не нужна работа на мобильных устройствах?

9 years ago

belozer

@apsavin Нужна. Сейчас сделал возможность прокрутки мышкой, далее по плану пальцы.

9 years ago

apsavin

Тогда почему не используете pointer events?

9 years ago

belozer

@apsavin Спасибо за наводку )

9 years ago

apsavin

@belozyorcev пожалуйста) Настоятельно рекомендую пройтись по всем блокам в bem-core, ~~RTFM~~ почитать доки.

9 years ago

kompolom

Кроме jsdoc есть что почитать по pointer events?

9 years ago

apsavin

Ну вот тут есть

9 years ago

apsavin

Ну или тут, если вообще)

9 years ago

Guria

Вот эта строка тоже укажет направление для изучения

9 years ago

belozer

@apsavin в приведённой документации БЭМ модуль подключается так

deps.js

({
    shouldDeps : [
        { block : 'jquery', elem : 'event', mods : { type : 'pointer' } }
    ]
})

    ['i-bem__dom', 'jquery__event_type_pointer'],
    function(provide, BEMDOM, $) {

Я пробовал так сделать, но ничего не получилось. Потом я полез искать исходники и посмотрел, что происходит расширение модуля jquery в объявлениях модулей. Поэтому сделал так, как ниже.

    ['i-bem__dom', 'jquery'],
    function(provide, BEMDOM, $) {

Сейчас всё заработало. Вот не знаю... Или документация устарела, или я не совсем что-то понимаю.

П.Н. Карусель на телефоне получилась отзывчивей, чем Owl Carousel, чему очень рад :santa:

9 years ago

apsavin

Похоже на опечатку https://github.com/bem/bem-core/pull/945.

9 years ago

tadatuta

@apsavin @belozyorcev да, в доке действительно была опечатка, спасибо за бдительность и PR! PS: для подписки через bindTo() и зависимость от jquery не нужна.

9 years ago

belozer

@tadatuta в коде jquery используется других местах

9 years ago

sipayRT

просто для отвода души:

конструкцию

this.bindTo( this.elem('view'), 'mousedown', this._swipeStart );
this.bindTo( this.elem('view'), 'mouseup', this._swipeEnd );

можно записать проще:

this.bindTo('view', {
    mousedown : this._swipeStart,
    mouseup : this._swipeEnd
});

9 years ago

belozer

@sipayRT Спасибо за наводку :)

Чтобы оставлять комментарии, необходимо авторизоваться.