Ahoi zusammen,
für den Fall, dass es jemand brauchen kann, hier eine Anleitung, um das Contao-Core-Feature Akkordeon mit jQuery umzusetzen:
JS:
Code:
$(document).ready( function() {
$('.toggler').not('.toggler_active').next('.accordion').hide();
$('.toggler').click( function() {
var trig = $(this);
if ( trig.hasClass('toggler_active') ) {
trig.next('.accordion').slideToggle('fast');
trig.removeClass('toggler_active');
} else {
$('.toggler_active').next('.accordion').slideToggle('fast');
$('.toggler_active').removeClass('toggler_active');
trig.next('.accordion').slideToggle('fast');
trig.addClass('toggler_active');
};
return false;
});
});
CSS-Beispiel:
Code:
.toggler {
font-size: 17px; font-size: 1.7rem;
line-height: 1.3em;
color: #fff;
text-transform: uppercase;
background: #3a0000 url('../images/icon-plus.png') no-repeat 98% center;
border:1px solid #888;
cursor:pointer;
padding:5px;
margin-bottom: 10px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.toggler_active {
color:#fff;
background: #3a0000 url('../images/icon-minus.png') no-repeat 98% center;
}
div.accordion {
margin-bottom: 30px;
}
.ce_accordion {
margin-bottom:5px;
}
Lesezeichen