现在Javascript库海量,流行的也多,比如jQuery,YUI等,虽然功能强大,但也是不万能的,功能不可能涉及方方面面,自己写一个的JS库是对这些的补充,很多也比较实用,把应用到项目中中去也比较方面,这也是对工作的一些积累,也加深对知识的理解。

 (function(jQuery){
/**
* 元素居中
* @return {[type]}
*/
jQuery.fn.mCenterDiv = function (){
this.css("position", "absolute");
this.css("border", "1px solid #ccc");
this.css("top", ($(window).height() - this.height()) / 2 + $(window).scrollTop() + "px");
this.css("left", ($(window).width() - this.width()) / 2 + $(window).scrollLeft() + "px");
this.show(100);
return this;
};
})(jQuery);

html部分代码:

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.box{width:400px;height:400px;background:pink;}
</style>
</head>
<body>
<div class="box"></div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="js.js"></script>
</body>
</html>
<script type="text/javascript">
$(function(){
$(".box").mCenterDiv();
$(window).resize(function(){
$(".box").mCenterDiv();
}); });
</script>

封装一个jquery库的更多相关文章

  1. 封装一个postMessage库,进行iframe跨域交互

    这是近期个人在开发chrome插件时的其中一个小总结.还有很多没有总结出来.因为目前插件还在迭代中,(herry菌插件,用于B站C站),属于个人业余的一个小项目.还有很多功能没有实现,以及还需要再看能 ...

  2. 如何封装一个Cookie库

    由Cookie详解我们已经了解到了Cookie是为了实现有状态的基于HTTP协议的应用而存在的.一个Cookie的由以下几个部分组成: //设置cookie的格式和Set-Cookie头中使用的格式一 ...

  3. 优雅的创建一个JavaScript库

    这篇文章的目的是通过演示一个简单的例子来介绍在JS中实例化和定义一个库的正确方法,以优化他人编写或维护自己的JS库. 在我们深入之前,我做了两点假设: 你知道简单的JavaScript或C语言. 你不 ...

  4. 仿照jquery封装一个自己的js库(一)

    所谓造轮子的好处就是复习知识点,加深对原版jquery的理解. 本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包 ...

  5. 仿照jquery封装一个自己的js库

    所谓造轮子的好处就是复习知识点,加深对原版jquery的理解.本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包括 ...

  6. [js高手之路] 跟GhostWu一起封装一个字符串工具库-架构篇(1)

    所谓字符串工具库就是利用javascript面向对象的知识封装一个常用的字符串处理方法库,首先给这个库起个名字,好吧就叫ghostwu.js. 看下ghostwu.js的整体架构: ; (functi ...

  7. 你不需要 jQuery,但你需要一个 DOM 库

    写这篇文章的目的,一方面是介绍一下自己编写的模块化 DOM 库 domq.js,另一方面是希望大家对 jQuery 有一个正确的认识,即使 jQuery 已经逐渐退出历史舞台,但是它的 API 将会以 ...

  8. 如何优雅的封装一个DOM事件库

    1.DOM0级事件和DOM2级事件 DOM 0级事件是元素内的一个私有属性:div.onclick = function () {},对一个私有属性赋值(在该事件上绑定一个方法).由此可知DOM 0级 ...

  9. 像jQuery那样,采用链式方法,封装一个方法:CSS()

    主要思路就是:返回this对象,将所获取的操作元素放入一个数组中.在原型中添加拓展方法 <html> <head> <title></title> &l ...

随机推荐

  1. 北京Uber优步司机奖励政策(1月1日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  2. 长沙Uber司机奖励政策(8月24日到8月30日)

    本周奖励(8月24日到8月30日) 滴滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://w ...

  3. ORB-SLAM(七)ORBextractor 特征提取

    该类中主要调用OpenCV中的函数,提取图像中特征点(关键点及其描述,描述子,以及图像金字塔) 参考TUM1.yaml文件中的参数,每一帧图像共提取1000个特征点,分布在金字塔8层中,层间尺度比例1 ...

  4. JavaSE打开windows文件

    第一个参数表示用什么程序打开,第二个参数表示文件的路径 例一: //用记事本打开d:/test.txt文件 Process p = java.lang.Runtime.getRuntime().exe ...

  5. 如何去除Eclipse下的JS引入报错(类似Syntax error on token...的异常信息)

    在Eclipse下引入外部JS文件,比如Jquery.js,经常会出现如下异常信息: 去除该异常方法: 1. 去掉Eclipse的JS验证 Windws---->Preferences----& ...

  6. 学会了vim中的自动补全功能

    好开心,再也不用再多个工具之间切换了,哈哈 擦,功能太弱

  7. Linux命令应用大词典-第42章 PostgreSQL数据库

    42.1 initdb:初始化PostgreSQL数据库 42.2 pg_ctl:控制PostgreSQL服务 42.3 psql:PostgreSQL交互式客户端工具 42.4 createdb:创 ...

  8. SpringMVC+mybatis+maven+Ehcache缓存实现

    所谓缓存,就是将程序或系统经常要调用的对象存在内存中,以便其使用时可以快速调用,不必再去创建新的重复的实例.这样做可以减少系统开销,提高系统效率. 缓存主要可分为二大类: 一.通过文件缓存,顾名思义文 ...

  9. C 判断成绩是否及格

    #include <stdio.h> int main(int argc, char **argv) { // 新建两个变量  pass代表及格分数的固定变量 score代表学生成绩的一个 ...

  10. 哈希表 -数据结构(C语言实现)

    读数据结构与算法分析 哈希表 一种用于以常数平均时间执行插入.删除和查找操作的数据结构. 但是是无序的 一般想法 通常为一个包含关键字的具有固定大小的数组 每个关键字通过散列函数映射到数组中 冲突:两 ...