✦ Script 15 : Boutons Ascenseur (Haut & Bas) ✦
Cette formule installe deux boutons fixes sur le côté de l'écran. Un simple clic fait glisser le visiteur tout en haut ou tout en bas du site de manière fluide.
/* =============================================
1. CODE HTML : À coller en bas de votre page
============================================= */
<div class="panneau-ascenseur">
<button onclick="window.scrollTo({top: 0, behavior: 'smooth'});">▲</button>
<button onclick="window.scrollTo({top: document.body.scrollHeight, behavior: 'smooth'});">▼</button>
</div>
/* =============================================
2. CODE CSS : À coller dans la zone <style>
============================================= */
html {
scroll-behavior: smooth;
}
.panneau-ascenseur {
position: fixed;
bottom: 30px;
left: 20px;
display: flex;
flex-direction: column;
gap: 8px;
z-index: 9999;
}
.panneau-ascenseur button {
background: #501d5c;
color: #5ce1e6;
border: 2px solid #bd8ec7;
border-radius: 50%;
width: 40px;
height: 40px;
font-weight: bold;
cursor: pointer;
box-shadow: 0 4px 12px rgba(0,0,0,0.5);
transition: 0.2s ease;
}
.panneau-ascenseur button:hover {
background: #ff8dfb;
color: #1a0a2a;
transform: scale(1.1);
}
Sorcière Corbeau | © 2026 Addict Creative | Tous droits réservés