Bluesky : flèches discrètes du carrousel d'images
Masque les flèches du carrousel d'images jusqu'au survol, gardant les médias épurés par défaut.
Code à copier
/* Hide image-carousel arrows until you hover the image group */
[data-testid="imageCarousel"] button[aria-label*="Next" i],
[data-testid="imageCarousel"] button[aria-label*="Previous" i],
[data-testid="imageCarousel"] [aria-label*="Next image" i],
[data-testid="imageCarousel"] [aria-label*="Previous image" i] {
opacity: 0 !important;
transition: opacity 0.2s ease-in-out !important;
}
[data-testid="imageCarousel"]:hover button[aria-label*="Next" i],
[data-testid="imageCarousel"]:hover button[aria-label*="Previous" i],
[data-testid="imageCarousel"]:hover [aria-label*="Next image" i],
[data-testid="imageCarousel"]:hover [aria-label*="Previous image" i] {
opacity: 1 !important;
}Comment utiliser cet exemple
- Copiez le code avec le bouton ci-dessus.
- Installez JustZix (2 minutes) et ouvrez l'extension sur la page cible.
- Ajoutez une nouvelle règle correspondant à cette page.
- Collez le code dans le panneau CSS de la règle et enregistrez — l'effet apparaît aussitôt.
Notez cet exemple
Aucune note — soyez le premier.