现在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. 20145234黄斐《Java程序设计》第一周学习总结

    教材学习内容总结 1.java是SUN公司推出的面相网络的编程语言,当时取名Oak,后改名Java. 2.Java三大平台分别为:Java SE.Java EE与Java ME. 3.Java不仅是程 ...

  2. mfc通过MapWinGIS控件读取shp文件（通过#import实现）

    在MFC工程中想使用MapWinGIS组件,有多种方法可以实现, 第一种方法,#Import来实现 1.首先注册MapWinGIS ActiveX组件, 2.新建一个单文档工程:MapGis,为控件添 ...

  3. 北京Uber优步司机奖励政策（3月17日）

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

  4. 用PowerDesign反向生成数据库Sql语句问题

            在用Pd15反向生成数据库时,生成的Sql语句在Sql Server Manager Studio里面报错,根本就执行不了.数据库用的是Sql Server 2008 R2.经过一番修 ...

  5. ajax跨域请求php

    在众多站群中,不同功能的系统使用独立的一个域名,各系统之间存在相互调用的关系.使用js的XMLHttpRequest调用其他域名提示跨域权限不足.有些可能认为都同属于同一个顶级域名或者说域名一模一样怎 ...

  6. 微信小程序—day03

    昨日问题 接着上一篇,昨天遇到的scroll-view组件不能滚动的问题. 今天经过调试,发现是由于:图片的实际宽高,大于给image设定的宽高导致的. 解决办法: 减小图片的实际宽高,使之小于ima ...

  7. 硬盘基础知识&&分区

    学习记录的笔记,虽然毫无章法 硬盘基础知识 磁盘的物理组成 如下图所示: 有关磁盘物理知识的详细介绍请看硬盘的存储原理和内部架构这篇博文 硬盘接口类型 IDE SATA SCSI SAS 光纤通道 I ...

  8. 手机端网页返回顶部js代码

    <!DOCTYPE html>  <html>  <head>  <meta http-equiv="Content-Type" cont ...

  9. LeetCode 240——搜索二维矩阵 II

    1. 题目 2. 解答 2.1. 方法一 从矩阵的左下角开始比较 目标值等于当前元素,返回 true: 目标值大于当前元素,j 增 1,向右查找,排除掉此列上边的数据(都比当前元素更小): 目标值小于 ...

  10. Chameleon-mini简介

    ChameleonMini(变色龙)原德国大学在研究RFID安全时所设计的一块针对多频段多类型RFID模拟的硬件,其设计本身支持ISO14443和ISO15693标准协议,最简单直接的用法就是把获取到 ...