Chcesz aby użytkownik Twojej strony docelowej mógł szybko wrócić do jej początku gdy znajdzie się na dole landing page?
Nic prostszego!

Możesz dodać kod do swojej strony, zaczynając od dodania odpowiedniego JavaScript.

1. Przejdź do wybranej landing page i otwórz zakładkę "Kody JavaScript". Następnie dodaj następujący kod:

<script>
$(document).ready(function () {

$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
$('.backtotop').fadeIn();} else {$('.backtotop').fadeOut();
}
});

$('.backtotop').click(function () {
$("html, body").animate({
scrollTop: 0
}, 600);
return false;
});

});
</script>

2. Następnie, otwórz landing page w edytorze i dodaj widget "Własny", a do niego podaną treść:
<a href="#" id="linkTop" class="backtotop"></a>

3. Pozostając w edytorze, otwórz zakładkę "Ustawienia" i dodaj następujący styl CSS (który możesz dowolnie edytować, w zależności od tego jaki wygląd przycisku chcesz osiągnąć):

#linkTop, #linkTop:before {
color: #a8d600;
border-color: #a8d600;
}
.backtotop {
border: 3px solid #a8d600;
}

#linkTop:before {
font-family: FontAwesome;
text-decoration: none;
content: "\f077";
}

.backtotop:before {
content: '\e75f';
font-family: "crum-fontello";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 45px;
font-size: 23px;
line-height:40px;
left: 0;
text-align: center;
font-variant: normal;
text-transform: none;
position: absolute;
}
.backtotop{
position: fixed;
right: 0;
bottom: 20px;
width: 45px;
height: 45px;
display: block;
z-index: 99999999;
border-radius: 100em;
}


4. Po dodaniu treści powyżej, osiągniesz oczekiwany efekt i pojawi się ikona, pozwalająca jednym kliknięciem powrócić do góry Twojej strony docelowej :)

Did this answer your question?