jQuery动画效果animate和scrollTop结合使用实例
发布时间:2020-12-14 22:19:21 所属栏目:资源 来源:网络整理
导读:CSS属性值是逐渐改变的,这样就可以创建动画效果。 只有数字值可创建动画(比如 "margin:30px")。 字符串值无法创建动画(比如 "background-color:red")。 复制代码 代码如下: $('#shang').click(function(){$('html,body').animate({scrollTop: '0px'},80
CSS属性值是逐渐改变的,这样就可以创建动画效果。 复制代码 代码如下: $('#shang').click(function(){$('html,body').animate({scrollTop: '0px'},800);}); 上面的代码表示滚动条跳到0的位置,页面移动速度是800。 结合scrollTop实用示例: 复制代码 代码如下: jQuery(document).ready(function($){ $('#shang').click(function(){ $('html,800); }); $('#comt').click(function(){ $('html,body').animate({scrollTop:$('#comments').offset().top},800); }); $('#xia').click(function(){ $('html,body').animate({scrollTop:$('#footer').offset().top},800); }); }); 表示点击相关ID移动到指定位置: 点击ID为shang的元素,回到顶部; 点击ID为comt的元素,回到ID为comments的位置; 点击ID为xia的元素,回到底部; 您可能感兴趣的文章:
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |