CODEWITHSUNDEEP
javascriptjqueryhtmlcssjquery-ui
Will
Will

Reputation: 3044

Draggable divs from accordion

I have created a pop out sideBar. In that sideBar I have a accordion which contains divs. Those divs are draggable. The user can drag those divs and position them main page.

The problem that I am experiencing is that when the divs are dragged they are not visible outside the accordion. This can been seen in This video.

I can see that it is to do with the overflow being set to hidden however when I remove this the accordion content is shown when it should be hidden. 

overflow: hidden;

JSFiddle to further show my problem.

How could I possibly fix this / what are possible ways to get around it.

Upvotes: 10

Views: 674

Answers (1)

Nicolae Olariu
Nicolae Olariu

Reputation: 2555

Try adding this to your css

.accordion-heading + div.accordion-body {
     position: static;
}

Is this what you are looking for? Updated fiddle http://jsfiddle.net/gNAFY/3/ If this solved your problem, it seems that inside bootstrap.css file, at line 5245, "position: relative" rule makes your divs not appearing outside the accordion. So you need to "reset" position to static. For "el + el" css selector to work in IE8 and earlier, don't forget the <!DOCTYPE>.

Upvotes: 3

Related Questions