ruby 2.5.7 Rails 5.2.4.3 OS: macOS Catalina
Vous n'avez pas besoin des fonctions ci-dessus.
1 Préparation des photos 2 Modifier la vue 3 Modifier le css 4 Modifier le fichier js (lors de l'ajout d'une animation au défilement de page)
Veuillez préparer une image comme celle-ci. Au fait, cette image a été créée avec l'ipad, alors n'hésitez pas à l'utiliser.
Veuillez stocker le fichier image sous app / assets / images.
Puisque je veux l'afficher sur toutes les pages cette fois, je vais le décrire à l'emplacement suivant.
erb:app/views/layouts/application.html.erb
<body>
<%= yield %>
<span id="back">
<a href="">
<%= image_tag asset_path('arrow.jpg'), data: {"turbolinks"=>false}, class: "arrow" %>
</a>
</span>
</body>
app/application.css
#back {
position: fixed;
right: 20px;
bottom: 20px;
}
.arrow{
width: 50px;
height: 50px;
}
Veuillez installer gem'jquery-rails '. Cliquez avec la souris pour activer l'animation.
app/assets/javascripts/application.js
$(function() {
$('#back a').on('click',function(event){
$('body, html').animate({
scrollTop:0
}, 800);
event.preventDefault();
});
});
Recommended Posts