Afficher une image au scroll
Afficher l'image masquée lors du défilement vers le bas ou vers le haut .
La plupart des animations sont réalisées à l'aide de JS, de sorte que Google ne les verra pas spécialement dans Fetch de Google.
Aucun contenu chargé via JavaScript ne sera exploré.
CSS
.as { display:none; }
Html
div class="as"
Javascript
var win = $(window);
var a = $('.as');
win.on('scroll', function() {
a.fadeIn();
win.off('scroll');
});
OU
var a = $('.as');
$(window).scroll(function() {
a.fadeIn();
});
OU
$(window).scroll(function () {
if ($(this).scrollTop() > 0) {
$('.as').fadeIn();
} else {
$('.as').fadeOut();
}
});
Progressive Enhancement:
L'amélioration progressive est une stratégie de conception Web qui met d'abord l'accent sur le contenu Web, permettant à chacun d'accéder au contenu et aux fonctionnalités de base d'une page Web, tandis que les utilisateurs disposant de fonctionnalités de navigateur supplémentaires ou d'un accès Internet plus rapide reçoivent la version améliorée à la place.