Hi @Rodrigo
Thank you very much for your input! Changing the Layout to a flex column did not help unfortunately. And I also tried diffrent approaches to this. The point it gets stuck is always that the.grid-view comboclass "survives" on these 2 elements also when it should not do that.
i can include my jQuery and GSAP code for that, but a minimal demo isn't realizable that easy because of the way the project is set up. Setting it up fresh & clean results in working fine, so i assume there is something wrong in the setup.
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/Flip.min.js"></script>
<script>
function indexFlip() {
const change = Flip.getState(
'.index_header-row, .index_item, .index_item-list, .index_list, .index_item-name, .index_item-logo, .index_item-abteilung'
)
$('.index_header-row').toggleClass('grid-view')
$('.index_item').toggleClass('grid-view')
$('.index_item-list').toggleClass('grid-view')
$('.index_list').toggleClass('grid-view')
$('.index_item-name').toggleClass('grid-view')
$('.index_item-logo').toggleClass('grid-view')
$('.index_item-abteilung').toggleClass('grid-view')
Flip.from(change, {
duration: 0.5,
ease: 'power1.inOut',
fade: true,
absoluteOnLeave: true,
nested: true,
prune: true,
})
}
//set Previous Radio Value one time on site load
var prev = $("input[name='index-radio']:checked").val();
$('input[type="radio"][name="index-radio"]').on('change', function() {
//Current Radio Value
var curr = $(this).val();
//Cases in which GSAP Flip should happen
if (curr == 'marke' && prev == 'wohnen') {
indexFlip();
} else if (curr == 'wohnen' && prev == 'marke') {
indexFlip();
} else if (curr == 'marke' && prev == undefined) {
indexFlip();
} else if (curr == 'marke' && prev == 'marke') {
indexFlip();
}
//Set Previous Radio Value
prev = $("input[name='index-radio']:checked").val();
});
</script>
It's difficult to include much more here than this code. The link to the site is in the initial post. Furthermore I completely understand that you don't have the time to take a look at every single website that gets posted here. And I know there is a reason for excluding the problem to the minimal possible area.
Thank you for the answer again, we might need to come up with another solution to this though