Problème: les composants Accordéon de Bootstrap et Foundation font lagguer l’affichage sur des pages longues (lorsqu’ils sont initialisés trop de fois).
Solution: ne pas les utiliser, mais préférer une petite fonction « ouvrir/fermer » qui s’active via un onClick="$(this).<ma_fonction>();" placé sur l’élément qui déclanche l’ouverture/fermeture.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<script type="text/javascript"> $.fn.openRow = function() { var $this = $(this); var $class = $this.attr('class'); if ($this.attr('aria-expanded') == 'false') { $this.attr('aria-expanded', true); if ($class == 'flights-primary-info') { $this.next('.is-sharecode').attr('aria-expanded', true); } else { $this.prev('.flights-primary-info').attr('aria-expanded', true); } $this.nextAll('.flights-secondary-info:first').attr('aria-expanded', true).removeClass('is-hidden'); } else { $this.attr('aria-expanded', false); if ($class == 'flights-primary-info') { $this.next('.is-sharecode').attr('aria-expanded', false); } else { $this.prev('.flights-primary-info').attr('aria-expanded', false); } $this.nextAll('.flights-secondary-info:first').attr('aria-expanded', false).addClass('is-hidden'); } }; </script> |
|
1 |
<a class="flights-primary-info" data-toggle="mobileSecondary-${repeat/flight/number}" aria-expanded="false" onClick="$(this).openRow();"> |