JQuery 插件 - 弹窗：BlockUI

JQuery的弹窗插件,网上实在有很多做的比较好的,比如artDialog.layer,甚至EasyUI等等.这些在效果上做的非常好.但我觉得一个小小的弹窗提示,没有必要引用这些(其实是有点大材小用了!)这里要介绍的是BlockUI,一个我认为非常好用的,简单朴素轻量级的插件. 先看一下效果: 下面就来讲一下使用. 一.引用插件 <script src="jquery.min.js" type="text/javascript"></script&…

50个jQuery插件可将你的网站带到另一个高度

Web领域一直在发生变化并且其边界在过去的每一天都在发生变化(甚至不能以小时为计),随着其边界的扩展取得了许多新发展.在这些进步之中,开发者的不断工作创造了更大和更好的脚本,这些脚本以插件方式带来更好的终端用户体验,它们比原来更轻量级,还有更强的处理能力. 关键是这些新发展起来的脚本和插件是能构建响应式Web的,而且还不会丧失它们原有的功能特性——除了更优秀和更轻巧(就文件大小而言)之外,它们还不会增加页面加载的时间. 通过浏览文档,掌握JQuery的语法是很容易的.它可以支持选择DOM元素,创…

点击弹出 +1放大效果 -- jQuery插件

20140110更新: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>提示插件</title> <style> body {margin:;padding:;font:12px/18px arial;color:#;} </style> <script src="http://code.jquery.c…

jQuery 插件 Magnify 开发简介（仿 Windows 照片查看器）

前言因为一些特殊的业务需求,经过一个多月的蛰伏及思考,我开发了这款 jQuery 图片查看器插件 Magnify,它实现了 Windows 照片查看器的所有功能,比如模态窗的拖拽.调整大小.最大化,图片的缩放.平移.旋转,键盘控制等.插件的样式都是最基础的 CSS,定制非常容易,可以轻松修改成自己喜欢的样式.随后会陆续发布 React 及 Vue 相关版本的插件.本文主要介绍插件的特点及使用方法,而关于插件开发的细节将会在之后的具体文章中说明. Github: https://github.c…

如何写jquery插件

首页新文章联系管理订阅自己写一个 jQuery 插件我知道这一天终将会到来,现在,它来了. 需求开发 SharePoint 的 CSOM 应用时,经常需要在网页上输出一些信息. 这种需求和 alert 的弹窗.F12 的断点查看信息的场景是不一样的:在这种场景下,你就是端着杯咖啡靠在那里坐着,看着关于应用程序运行的信息不断的在网页上输出,不用去关闭弹窗.也不用去设置断点. 详细的功能需求如下: 输出的信息中自动包含时间输出的信息按照类型显示不同的样式输出的信息…

jQuery插件EasyDrag轻松实现JS拖动的效果

jquery.easydrag下载地址:http://ishare.iask.sina.com.cn/f/34289681.html 实现效果图:分布实现一.页面Html标签元素定义 <!doctype html> <html> <head> <meta charset="UTF-8"> <title>页面加载时弹出一个对话框</title> <body> <div class="btn…

jquery 插件和后台模板搜集

弹框 alert confirmhttp://www.jq22.com/jquery-info2607 jQuery表格排序筛选插件http://www.jq22.com/jquery-info8805http://www.jq22.com/jquery-info7356 easyDialog 简单.实用的弹出层组件http://www.jq22.com/jquery-info7721 jQuery多功能图片弹窗插件piroboxhttp://www.jq22.com/jquery-info59…

常用JQUERY插件大全

jQuery内容滚动插件-BoxSlider jQuery artDialog对话框插件移动端日期选择组件图像延迟加载库Echo.js 轮播图FlexSlider插件 Slick.js幻灯片使用方法 JavaScript响应式轮播图插件–Flickity Intro.js 分步向导插件使用方法 ScrollReveal-元素随页面滚动产生动画的js插件支持移动触摸的jQuery图片Lightbox插件 Owl Carousel幻灯片插件 kissui.scrollanim页面滚动动画库插件…

Jquery插件：提示框

在实际项目中,很容易有这种需求:当某个操作成功或失败,需要给用户一个提示.当然最简单的做法是调用alert()方法弹窗.但alert()属于JavaScript中BOM部分,每个浏览器的样式不太一样,这个我们改变不了.另外,弹窗给用户的感觉也不是很好.还需要手动关闭一次. 鉴于以上的理由,自己实现个弹出提示很有必要.本文的实现是基于jquery的,是一款jquery插件,可以直接用,弹出后,定时消失.弹窗样式不符合需求的,可以修改的. 效果: <!doctype html> <html&…

自己写jquery插件之模版插件高级篇(一)

需求场景最近项目改版中,发现很多地方有这样一个操作(见下图gif动画演示),很多地方都有用到.这里不讨论它的用户体验怎么样. 仅仅是从复用的角度,如果每个页面都去写text和select元素,两个button按钮,增加add和delete对应的js函数,无疑大大增加了工作量和维护成本. select有预设值的情况: 下面就开始动手把这4个html元素做成一个JQuery插件. jquery插件结构如果你是零基础,请参考Jquery官网对jquery plugin的介绍:http://lear…

JQuery插件定义

一:导言有些WEB开发者,会引用一个JQuery类库,然后在网页上写一写$("#"),$("."),写了几年就对别人说非常熟悉JQuery.我曾经也是这样的人,直到有一次公司里的技术交流,我才改变了自己对自己的看法. 二:普及JQuery知识知识1:用JQuery写插件时,最核心的方法有如下两个: $.extend(object) 可以理解为JQuery 添加一个静态方法. $.fn.extend(object) 可以理解为JQuery实例添加一个方法. 基本的…

BootStrap_04之jQuery插件（导航、轮播）、以及Less

1.列偏移与列排序: ①列偏移:控制列出现的位置,某列偏移后,后序列会随之偏移--只能右偏移: col-lg/md/sm/xs-offset-*; ②列排序:控制某一列的位置,该列可以左(pull)右(push)调整,其排序后,其它列不受影响: col-lg/md/sm/xs-push-*:右移: col-lg/md/sm/xs-pull-*:左移:2.BootStrap插件--jQuery插件: ①定义jQuery对象插件: jQuery.fn.函数名=function(){} ②调用jQue…

锋利的jQuery--编写jQuery插件(读书笔记五)[完结篇]

1.表单验证插件Validation 2.表单插件Form 3.动态事件绑定插件livequery 可以为后来的元素绑定事件类似于jQuery中的live()方法 4.jQuery UI 5.jQuery Cookie 6.遮罩层插件:thickbox 7.编写jQuery插件 <1>编写插件的目的:给已经有的一些列方法或函数做一个封装,一遍在其他地方使用,方便后期维护和提高开发效率. <2>三种类型的插件 a:封装对象方法的插件 jQuery…

2016年6月份那些最实用的 jQuery 插件专辑

jQuery 是一个快速.流行的 JavaScript 库,jQuery 用于文档处理.事件处理.动画和 Ajax 交互非常简单,学习曲线也很平坦.2016年6月的 jQuery 插件专辑里,我们选择一些最好的和有用的 jQuery 插件分享给大家. 您可能感兴趣的相关文章 Web 前端开发人员和设计师必读精华文章推荐精心挑选的优秀jQuery Ajax分页插件和教程 12个让人惊叹的的创意的 404 错误页面设计让网站动起来!12款优秀的 jQuery 动画插件 8个前沿 HTML5 &…

教你开发jQuery插件（转）

教你开发jQuery插件(转) 阅读目录基本方法支持链式调用让插件接收参数面向对象的插件开发关于命名空间关于变量定义及命名压缩的好处工具 GitHub Service Hook 原文:http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html 要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样,得平台者得天下.苹果,微软,谷歌等巨头,都有…

Lazy Load, 延迟加载图片的 jQuery 插件.

Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的. 在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服务器负担. 使用方法: Lazy Load 依赖于 jQuery.所有在head区域需要加入jquery和jQuery.lazyload…

JS原生ajax与Jquery插件ajax深入学习

序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因时间原因,并未在所有浏览器上进行测试,目前测试的IE8,9,10,Google Chrome,Mozilla Firefox,Opera常用几款,如大家在进行验证测试发现有问题,请及时反馈与我,谢谢大家. 言归正传,不说废话直接上代码: 前端代码 <!DOCTYPE html PUBLIC "…

jquery插件扩展的学习

jquery插件的学习可以点击这里举个例子 //首先先来一个插件 (function($){ $.fn.extent({ bigfont:function(){ return this.css('fontSize':"30px") } }) })(jQuery) <p class='p1'>好好学习天天向上</p> (function($){ $.fn.extend({ bigfont:function(){ return this.css('fontSize…

Jquery 插件\Js 插件收集

1.linq.js 使得js 的数组像c#的linq操作一下样 http://linqjs.codeplex.com/ 2.分页插件 https://github.com/mricle/Mricode.Pagination 3.自动自动补全 autocomplete和typeahead.本站使用的是typeahead. jQueryUI-Autocomplete 自动补全插件-bootstrap-3-typeahead 4.Jquery 插件库 http://www.htmleaf.com/ …

在Web工程中引入Jquery插件报错解决方案

在学习Jquery插件的时候,遇到一个问题就是新建web工程后在WebRoot下引入Jquery插件的时候报错,不知道为什么好纠结,但是项目能正常运行,后来找到解决方案,在这里给大家分享一下. 解决方案: 1.在MyEclipse软件中找打-----windows----preferences,会出现一个如下图所示的界面: 2.在检索框输入一个validation----单击该validation节点,将对于JavaScript脚本的验证取消勾,然后点击Apply,一直yes就行. 3.上述步骤…

jQuery插件中的this指的是什么

在jQuery插件的范围里, this关键字代表了这个插件将要执行的jQuery对象, 但是在其他包含callback的jQuery函数中,this关键字代表了原生的DOM元素.这常常会导致开发者误将this关键字无谓的包在jQuery中. 可以看下面的例子: <div class="content" style="background:#ff5000"> </div> <div class="box">joj…

jquery插件封装成seajs模块

jquery直接在html中引入. jquery插件修改为: define(function (require, exports, moudles) { return function (jquery) { // 插件源码..... // 插件源码..... // 插件源码..... // 插件源码..... // 插件源码..... } }) 这样它就是一个seajs模块了, 像下面这样引用到项目: define(function (require, exports, module) { re…

js最详细的基础，jquery 插件最全的教材

一．Js的this,{},[] this是Javascript语言的一个关键字,随着函数使用场合的不同,this的值会发生变化.但是有一个总的原则,那就是this指的是调用的函数自己. { } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数. [ ]中括号,表示一个数组,也可以理解为一个数组对象. { } 和[ ] 一起使用,我们前面说到,{ } 是一个对象,[ ] 是一个数组,我们可以组成一个对象数组. 二．JS的prototype和__proto__ 1．prototyp…

一个简单的消息提示jquery插件

最近在工作中写了一个jquery插件,效果如下: 就是一个简单的提示消息的一个东西,支持最大化.最小化.关闭.自定义速度.自定义点击事件,数据有ajax请求和本地数据两种形式.还有不完善的地方,只做了最基本的功能,等有了修改再上传上来. /** * 消息提示<br> * 自动生成的html结构如下: * * <div class="title">消息提醒 <div class="toggle" style="">…

jQuery插件编写及链式编程模型小结

JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我们就来看看如何把我们常用的功能做出JQuery插件,然后像使用jQuery那样来操作DOM. 一.jQuery插件开发快速上手 1.jQuery插件模板关于jQuery插件的编写,我们可以通过为jQuery.fn增加一个新的函数来编写jQuery插件.属性的名字就是你的插件的名字,其模板如下: (function($){ $.fn.m…

jquery插件的两种形式

这里总结一下jquery插件的两种形式,一种是通过字面量的形式组织代码,另一种是通过构造函数的方式.下面就两种形式来分析俩个例子. 例子1: ;(function ($,window,document,undefined) { $.fn.changeColor= function (option) { var defined={ width:"400", height:"500", color:"red", module:"animat…

JQuery插件之Jquery.datatables.js用法及api

1.DataTables的默认配置 $(document).ready(function() { $('#example').dataTable(); } ); 示例:http://www.guoxk.com/html/DataTables/Zero-configuration.html 2.DataTables的一些基础属性配置 "bPaginate": true, //翻页功能 "bLengthChange": true, //改变每页显示数据数量 "…

jquery插件编写模版

jquery插件是什么??这里以讨论实力方法为主,比如 $("div").pluginname({}); 他的最简单形势应该是 $.prototype.plugin = function(){} 我们一点点来加东西 1,自己的变量不污染全局,别人的变量不污染我们 (function($,undefined){ var window = Function("return this")();//一定是window $.prototype.plugin = functio…

详解jquery插件中;(function ( $, window, document, undefined )的作用

在jquery插件中我们经常看到以下这段代码 1 2 3 ;(function ( $, window, document, undefined ){ //函数体内具体代码 })(jQuery, window,document); 对于很多初学者来说很难明白这表示什么,下边我将为大家介绍其相应的作用. 1.代码最前面的分号,可以防止多个文件压缩合并以为其他文件最后一行语句没加分号,而引起合并后的语法错误. 2.匿名函数(function(){})();:由于Javascript执行表达式是从圆括…