CODEWITHSUNDEEP
jqueryhtmlcss
vdezign solution
vdezign solution

Reputation: 29

How to move div from right to left on button click using Jquery

i want to make a form in which i want to display the question dynamically i.e if user answers the first question i want that question to be slides up and next question appears sliding from left. here is my code

http://jsfiddle.net/hcmLw/3466/

i don't know why the place of second div changes accordingly.

here is my jquery code

    $(".myButton").click(function () {

    // Set the effect type
    var effect = 'slide';

    // Set the options for the effect type chosen
    var options = { direction: 'right' };

    // Set the duration (default: 400 milliseconds)
    var duration = this.id;

    $('#myDiv').toggle(effect, options, duration);
});

Upvotes: 0

Views: 1645

Answers (1)

Guruprasad J Rao
Guruprasad J Rao

Reputation: 29683

That's because you div slideleft is occurring before the slideUp happens and since your divs are not positioned absolutely they will take up space available in the design and once one element is hidden the sliding left div will take that position. Just set a position:absolute to a div and you can see it will come from where it should be.

DEMO

div{
    position:absolute;
    width:100%
}

Upvotes: 1

Related Questions