当前位置: 首页 > 工具软件 > AnimateScroll > 使用案例 >

教你什么叫AnimateScroll滚动

竺鸿骞
2023-12-01

AnimateScroll是一个jQuery插件,使您能够滚动到页面的任何部分在风格上由刚调用animatescroll()与功能Id或Classname 要滚动到的元素。

<script src="https://raw.githubusercontent.com/yevhentiurin/animatedscrolljs/master/releases/jquery.animatedscroll-1.1.5.min.js">

这个插件需要两件事才能工作,一个是“jQuery库”,另一个是“animatescroll.js”文件

主要的滚动效果有:

// #section-2 表示id选择器,也可以换成class选择器

$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInOutBack'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeOutBounce'}); 
$('#section-2').animatescroll({scrollSpeed:3000,easing:'easeOutElastic'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInQuad'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeOutQuad'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInOutQuad'});
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInCubic'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeOutCubic'});
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInOutCubic'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInQuart'});
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeOutQuart'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInOutQuart'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInQuint'});
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeOutQuint'});
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInOutQuint'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInSine'});
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeOutSine'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeInOutSine'}); 
$('#section-2').animatescroll({scrollSpeed:2000,easing:'easeOutBack'});

 类似资料: