amélioration swiper suite

This commit is contained in:
Deltacms 2023-02-12 09:07:24 +01:00
parent 980a0cf07f
commit 0cfd27f385
2 changed files with 32 additions and 29 deletions

View File

@ -1,32 +1,34 @@
/* Script pour bannière animée avec effet de défilement vertical */ /* Script pour bannière animée avec effet de défilement vertical */
/* Adapte la largeur et la hauteur des images de la bannière à la taille de la fenêtre client */ /* Adapte la largeur et la hauteur des images de la bannière à la taille de la fenêtre client */
$(document).ready(function(){ $.wrapper = function(){
$.wrapper = function(){ var heightMod ,
var heightMod , widthMod,
widthMod, wclient;
wclient; wclient = window.innerWidth;
wclient = window.innerWidth; switch ( verticalBannerWidthSite )
switch ( verticalBannerWidthSite ) {
{ case "75vw":
case "75vw": widthMod = 0.75 * wclient;
widthMod = 0.75 * wclient; break;
break; case "85vw":
case "85vw": widthMod = 0.85 * wclient;
widthMod = 0.85 * wclient; break;
break; case "95vw":
case "95vw": widthMod = 0.95 * wclient;
widthMod = 0.95 * wclient; break;
break; default:
default: widthMod = wclient;
widthMod = wclient; }
} heightMod = verticalBannerHeightImg * ( widthMod / verticalBannerWidthImg );
heightMod = verticalBannerHeightImg * ( widthMod / verticalBannerWidthImg ); $("#headerSwiper .swiper").css("width", widthMod);
$("#headerSwiper .swiper").css("width", widthMod);
$("#headerSwiper .swiper").css("height", heightMod); $("#headerSwiper .swiper").css("height", heightMod);
} }
$(document).ready(function(){
$.wrapper();
});
$(window).resize(function(){
$.wrapper(); $.wrapper();
$(window).resize(function(){
$.wrapper();
});
}); });

View File

@ -1,16 +1,17 @@
/** Swiper pour Deltacms personnalisation **/ /** Swiper pour Deltacms personnalisation **/
/*
#headerSwiper .swiper { #headerSwiper .swiper {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
*/
/* la class swiper-wrapper est modifiée par le script contenu dans le json theme/header/swiperContent */ /* la class swiper-wrapper est modifiée par le script contenu dans le json theme/header/swiperContent */
/*
#headerSwiper .swiper-wrapper{ #headerSwiper .swiper-wrapper{
width: 100%; width: 100%;
max-height: 600px; max-height: 600px;
} }
*/
#headerSwiper .swiper-slide { #headerSwiper .swiper-slide {
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -21,6 +22,6 @@
display: block; display: block;
width: 100%; width: 100%;
height: 100%; height: 100%;
max-height: 600px; max-height: 600px;
object-fit: cover; object-fit: cover;
} }