4

I was trying to use this slide out panel with Bootstrap, which give you the option to slide out from the right http://www.building58.com/examples/tabSlideOut.html . but it doesnt seem compatible. can someone recommend which slide out panel I can use that is compatible with bootstrap?

1 Answer 1

14

A bit of CSS and jQuery are enough to rebuild this function. Take a look at my jsfiddle.

jQuery Snippet

    $('#opener').on('click', function() {       
    var panel = $('#slide-panel');
    if (panel.hasClass("visible")) {
        panel.removeClass('visible').animate({'margin-left':'-300px'});
    } else {
        panel.addClass('visible').animate({'margin-left':'0px'});
    }   
    return false;   
});

Full Example: http://jsfiddle.net/9Le8X/2/

3
  • Thank you..how do i go about adding it to the right side. so that when the screen resizes it always stay at the right?
    – user244394
    Mar 12, 2014 at 0:04
  • Yes. how can i remove the horizontal scrolling ?
    – user244394
    Mar 12, 2014 at 2:50
  • body {overflow-x: hidden;}
    – sevenX
    Mar 13, 2014 at 10:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.