Question

I'm trying to integrate jakiestfu's Snap.js with Twitter Bootstrap. I've got something that functions (I can get the content to slide, or open a drawer via a click event). However, I'm at the limit of my CSS skills for the final problem: The drawer content is always visible regardless of the state of the drawer.

JSFiddle example

While I could hard-code the visibility of the drawer element on document load and do something on the open/close click event, that doesn't do anything for the drag capability that Snap.js has.

addEvent(document.getElementById('open-left'), 'click', function () {
// Muck with visibility in here
// Added code sample because StackOverflow wants it with a fiddle...
if (snapper.state().state == "left") {
    snapper.close();
} else {
    snapper.open('left');
}});
Was it helpful?

Solution

You need to setup a background color for your content:

#content{
    background: white;
}

Working fiddle: http://jsfiddle.net/basarat/ygm3L/

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top