CODEWITHSUNDEEP
javascriptjqueryhtmlcsstwitter-bootstrap
Manoz
Manoz

Reputation: 6587

Containment in jquery

I am trying to create switch buttons with on/off states(Using twitter bootstrap).

In this demo you can see that i have outer border to button. Button draggable is true to x-Offset.

I want button not to go out of my boundary. So i put it in a div element and set it to some width. I don't think it is going good.

Please suggest me what can i do to bound this button in border area.

Fiddle link- http://jsfiddle.net/stackmanoz/w6AsC/3/

Some code shelf-

<div style="width:200px;border:1px dashed #ddd">
    <p id="button" class="btn-inverse btn">Regular link</p>
</div>

And script-

$(document).ready(function () {


        $('#button').draggable({ axis: 'x' });

    });

Upvotes: 0

Views: 103

Answers (1)

Christoph
Christoph

Reputation: 51201

Add an extra parameter as explained in the Docs, your friend and helper.

    $('#button').draggable({ axis: 'x',containment: "parent" });

Demo

This way you theoretically don't even need the axis parameter.

Upvotes: 2

Related Questions