博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jquery 返回顶端组件
阅读量:7072 次
发布时间:2019-06-28

本文共 1480 字,大约阅读时间需要 4 分钟。

自己写了一个基于jquery的返回页面顶端的组件。 

(function($) { var g; $.backtop = function(options) { extend($.backtop.config, options); this.config = $.backtop.config; this.init(); g = this; }; $.backtop.config = { title : null,// 返回顶端文字说明 df_color : "#77AA55"// 组件默认颜色 }; $.backtop.prototype = { config : null, backtop : null,// 当前创建返回顶端对象 init : function() { this._scrool(); }, _scrool : function() { window.onscroll = function() { g._create_ob($(window).scrollTop()); }; }, _create_ob : function(top) { if(top==0){ $("#back_top").remove(); return; } $("#back_top").remove(); this.backtop = $("
"); $(this.backtop).bind("click",function(){ g._moveTo(); }); $(this.backtop).bind("mouseover",function(){ $(g.backtop).removeClass(); $(g.backtop).addClass("mouse"); }); $(this.backtop).bind("mouseout",function(){ $(g.backtop).removeClass(); $(g.backtop).addClass("mouseover"); }); $(this.backtop).attr("id","back_top"); /*$(this.backtop).css("backgroundColor", this.config.df_color);*/ $(this.backtop).css("zIndex", 1000); $(this.backtop).css("position", "absolute"); $(this.backtop).css("cursor","pointer"); $(this.backtop).width(30); $(this.backtop).height(30); $(this.backtop).css("left",$("body").attr("clientWidth")-50); $(this.backtop).css("top", top+300); $("body").append(this.backtop); },// 创建返回顶端jquery对象 _moveTo:function(){ $("#back_top").remove(); window.scroll(0,0); } }; })(jQuery); var extend = function($cf, options) { for ( var a in options) { $cf[a] = options[a]; } };

 

转载地址:http://sjkml.baihongyu.com/

你可能感兴趣的文章
mime.types:强制下载 application/force-download
查看>>
PHP数组函数总结
查看>>
定时任务
查看>>
MSChart 设置饼图颜色 图例背景色 图例显示位置
查看>>
具有 CSA CCM 证明的 SOC 2 可简化 Windows Azure 客户的安全性评估过程
查看>>
字符串逆序
查看>>
ping, tracert和traceroute命令详解(转载)
查看>>
RedHat的定制安装
查看>>
jQuery中mouseleave和mouseout的区别详解
查看>>
[LeetCode] Binary Tree Level Order Traversal Solution
查看>>
[Codeforces375E]Red and Black Tree
查看>>
MySQL基础学习之数据库
查看>>
python 键盘输入
查看>>
算法实验1 两个数组的中位数
查看>>
仓储管理的目标
查看>>
gcc g++ 参数介绍
查看>>
本博客供喜欢JAVA的同学一起交流学习
查看>>
trie树
查看>>
xshell常用命令大全
查看>>
秒杀?能不能先预估下服务器能不能顶的住再玩啊!!!
查看>>