Wednesday, 11 September 2013

Bootstrap Collapse - each div by some class?

Bootstrap Collapse - each div by some class?

Have more than one div for collapsing with some class without ID:
<div class="spoiler">
<div class="spoiler-btn">spoiler1</div>
<div class="spoiler-body>spoiler 1</div>
</div>
<div class="spoiler">
<div class="spoiler-btn">spoiler2</div>
<div class="spoiler-body>spoiler 2</div>
</div>
<div class="spoiler">
<div class="spoiler-btn">spoiler3</div>
<div class="spoiler-body>spoiler 3</div>
</div>
With data-attribute data-toggle="collapse" data-target=".spoiler-body" in
.spoiler-btn plugin collapsing all div. But need collapsing only within
parent .spoiler
write this:
$.fn.ready(function() {
$('.spoiler').each(function(){
var $this = $(this)
$this.on('click', '.spoiler-head', function (e) {
$this.children('.spoiler-body').collapse('toggle')
e.preventDefault()
})
})
})
Not sure of the code. And it does not work in mobile Safari. Any right way?
Thanks

No comments:

Post a Comment