|
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 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
$(document).ready(function(){ // On récupère la largeur de chaque image. // Si l'image a une largeur inférieure ou égale à 1224px // on ajoute une classe ".container" à l'élément ".cRow". function setClassForImageContainer(htmlElement){ $(htmlElement).each(function(){ var img = $(this)[0]; $('<img/>') .attr('src', $(img).attr('src')) .on('load', function(){ if(this.width <= 1224){ $(img).closest('.cRow').addClass('container'); } }); }); } function setClassForOtherContainer(){ $('div.cRow').each(function(){ // Tous les blocs ".cRow" qui ne font pas l'objet d'un // traitement spécifique via une autre fonction. // Si l'élément ".cRow" contient une image // c'est la fonction "setClassForImageContainer" // qui s'occupe d'attribuer ou non la classe ".container". if($(this).find('div.image-container').length != 0){ // do nuffin' } // Sinon : else{ $(this).addClass('container'); } }); } // si gabarit 2 colonnes if($('body#tplSidebar').length != 0){ // console.log('gabarit 2 colonnes'); $('section#heading').addClass('container-xl'); // Pour les blocs ".cRow" qui contiennent des images, mais uniquement dans "#heading" : setClassForImageContainer('#heading div.image-container img'); } // si gabarit 1 colonne else if($('body#tplNosidebar').length != 0){ // console.log('gabarit 1 colonne'); $('section#content').addClass('container-xl'); // Pour tous blocs ".cRow" de la page qui contiennent des images : setClassForImageContainer('div.image-container img'); // Pour les blocs ".cRow" qui ne font pas l'objet d'un traitement spécifique via une autre fonction : setClassForOtherContainer(); } }); |