搜索
首页 电脑/网络

基于jquery的回到页面顶部按钮_jquery

全部回答

2023-03-21

0 0

    css代码:代码如下:。scroll-up {background: #dcdcdc url('up。png') no-repeat center center;width:48px !important; /*for ff and other standard browser*/height:48px !important;_width: 58px; /*for IE6 nonstandard box model*/_height: 58px;position: fixed;_position: absolute; /*for IE6 fixed bug*/opacity: 。
    6;filter: Alpha(opacity=60); /*for IE opacity*/padding:5px;cursor: pointer;display: none;/*css3 property for ff chrome*/border-radius:5px;-webkit-transition-property: background-color, opacity;-webkit-transition-duration: 1s;-webkit-transition-timing-function: ease;-moz-transition-property: background-color;-moz-transition-duration: 1s;-moz-transition-timing-function: ease;}。
    scroll-up:hover {background-color:#B9B9B9;opacity: 。8;}下面是jquery代码代码如下:;(function($) {$。
  scrollBtn = function(options) {var opts = $。  extend({}, $。scrollBtn。defaults, options);var $scrollBtn = $('')。
  css({bottom: opts。bottom + 'px',right: opts。right + 'px'})。addClass('scroll-up')。  attr('title', opts。
  title)。click(function() {$('html, body')。animate({scrollTop: 0}, opts。duration);})。appendTo('body');// 绑定到window的scroll事件$(window)。
    bind('scroll', function() {var scrollTop = $(document)。scrollTop(),viewHeight = $(window)。
  height();// 小于配置的显示范围 则fadeOutif(scrollTopif($scrollBtn。  is(':visible'))$scrollBtn。fadeOut(500);// 大于配置的显示范围 则fadeIn} else {if($scrollBtn。
  is(':hidden'))$scrollBtn。fadeIn(500);}// 解决IE6下css中fixed没有效果的bugif(isIE6()) {var top = viewHeight + scrollTop - $scrollBtn。
    outerHeight() - opts。bottom;$scrollBtn。css('top', top + 'px');}});// 判断是否为IE6function isIE6() {if($。
  browser。msie) {if($。browser。version == '6。  0') return true;}}};/*** -params* -showScale: scroll down how much to show the scrollup button* -right: to right of scrollable container* -bottom: to bottom of scrollable container*/$。
    scrollBtn。defaults = { // 默认值showScale: 100, // 超过100px 显示按钮right:10,bottom:10,duration:200, // 回到页面顶部的时间间隔title:'back to top' // div的title属性}})(jQuery);$。
    scrollBtn({showScale: 200, //下滚200px后 显示按钮bottom:20, // 靠底部20pxright:20 // 靠右部20px});backToTop。
  rar。

类似问题换一批

热点推荐

热度TOP

相关推荐
加载中...

热点搜索 换一换

电脑/网络
电脑/网络
程序设计
电脑装机
操作系统/系统故障
硬件
笔记本电脑
百度
互联网
反病毒
软件
举报
举报原因(必选):
取消确定举报