Часто на одностраничниках нужно внедрять кнопку «проскроллить наверх»:
Самое противное, что каждый раз приходится эту кнопку рисовать, чтобы подогнать под дизайн сайта. Здесь метод оформления кнопки через чистый css. Для начала нужно, конечно подключить файл .js:
scroll_top (скачайте его).
Потом добавьте в свой файл css следующий код:
.scrollTop { color: #fff; width: 55px; height: 55px; background-color: #a58e7c; bottom: 15px; right: 15px; left: auto; border: none; } .scrollTop:before { content: "\f077"; font-family: FontAwesome; font-size: 22px; }
Вуаля!
Как вы видите — можно задать размеры кнопки, ее цвет, цвет стрелки, обводку (опционально). За отображение стрелки отвечает шрифт Font Awesome, то есть шрифтовая библиотека тоже должна быть подключена. Так как мы почти всегда используем ее для отображения иконок соцсетей и прочих няшек, то, думаю, это не проблема.
Размер стрелки определяется размером шрифта Font Awesome:
font-size: 22px;
You must be logged in to post a comment.