mongmong seesee
mongmong seesee

Reputation: 1015

How to disabled javascript when mouse out div?

How to disabled javascript when mouse out div ?

This is my code onmousemove to change div id left width, but why javascript still work, when i onmouseout id container how to disabled javascript when i onmouseout out id container

i tried

    container.on('mouseout', function (e) {
        isResizing = false;
    });

but not work , how can i do that ?

https://jsfiddle.net/ksfqgv0p/2/

var isResizing = false;
$(function () {
   var container = $('#container'),
        left = $('#left'),
        handle = $('#handle');

    container.on('mousemove', function (e) {
        isResizing = true;
    });

    container.on('mouseout', function (e) {
        isResizing = false;
    });

    $(document).on('mousemove', function (e) {
        if (!isResizing) 
        return;
        left.css('width', e.clientX - container.offset().left);
        handle.css('margin-left', e.clientX - container.offset().left);
    });
});

Upvotes: 3

Views: 69

Answers (1)

Rino Raj
Rino Raj

Reputation: 6264

var isResizing = false;
$(function () {
   var container = $('#container'),
        left = $('#left'),
        handle = $('#handle');

    left.on('mousemove', function (e) {
        isResizing = true;
    });

    left.on('mouseout', function (e) {
        isResizing = false;
    });

    $(document).on('mousemove', function (e) {
        if (!isResizing) 
        return;
        left.css('width', e.clientX - container.offset().left);
        handle.css('margin-left', e.clientX - container.offset().left);
    });
});

DEMO FIDDLE

Upvotes: 3

Related Questions