CMS Development

hernanmk
メンバー

Animate scroll in the same page

解決

Hi! 

 

Is there any possibility of doing a scroll animation on a link on the same page without jquery?

 

I use differents jquerys but none works. 

The html link is simple: 

 

Image with this link: https://www.adbarbieri.com/productos#enlace2

<a name="enlace2"></a>

 

I would like click in the image and make the animation scroll!

 

0 いいね!
1件の承認済みベストアンサー
MitchL
解決策
参加者

Animate scroll in the same page

解決

Hey @hernanmk,

 

Here's a smooth scrolling function I'm currently using:

 

 // Smooth Scrolling 
$(document).ready(function() {
$('a[href*=#]').bind('click', function(e) {
e.preventDefault();
var target = $(this).attr("href");
$('html, body').stop().animate({
scrollTop: $(target).offset().top-100
}, 500);
return false;
});
}); 

元の投稿で解決策を見る

5件の返信
Ken_gitahi
メンバー

Animate scroll in the same page

解決

There is an even easier way. Go to Settings>General>advanced.

Thank add this snippet to the head html section <style>
* {
scroll-behavior: smooth;
}
</style>

0 いいね!
RHamet
メンバー

Animate scroll in the same page

解決

I just had this hassle and concept I might percentage at least the answer that worked for me. When you go to insert the photo rather of selecting "add files" select from URL and then link the GIF you want. You can create a hyperlink to your GIF a gaggle of various approaches.

0 いいね!
MitchL
解決策
参加者

Animate scroll in the same page

解決

Hey @hernanmk,

 

Here's a smooth scrolling function I'm currently using:

 

 // Smooth Scrolling 
$(document).ready(function() {
$('a[href*=#]').bind('click', function(e) {
e.preventDefault();
var target = $(this).attr("href");
$('html, body').stop().animate({
scrollTop: $(target).offset().top-100
}, 500);
return false;
});
}); 
hernanmk
メンバー

Animate scroll in the same page

解決

Thanks @MitchL 

 

Do I need to modify something or just copy it as it is and paste it at the end of my html?

0 いいね!
MitchL
参加者

Animate scroll in the same page

解決

It should just be good to go if you paste it in!

0 いいね!