本文实例讲述了基于jQuery插件jqzoom实现的图片放大镜效果。分享给大家供大家参考，具体如下： jqzoom插件实现图片放大镜效果。图1.1jqzoom插件实现图片放大镜效果 1、引入jqurty和jqzoom插件 <script src="/js/common/jquery-1.6.2.js" type="text/javascript"></script> <script src="/js/common/jquery.jqzoom.js" type="text/javascript"></script> 2、应用官方网站给定的样式 /*jQzoom*/ .jqzoom{border:1px solid #BBB;float...
在实际开发工作中，总会碰到像滚动，分页，日历等展示效果的业务需求，对于接触过jQuery以及熟悉jQuery使用的人来说，首先想到的肯定是寻找现有的jQuery插件来满足相应的展示需求。目前页面中常用的一些组件，都有多种jQuery插件可供选择，网络上也有很多专门收集jQuery插件的网站。利用jQuery插件确实可以给我们的开发工作带来便捷，但是如果只是会简单使用，而对其中的原理不甚了解，那么在使用过程中碰到问题或者对插件进行定制...
本文实例分析了jQuery插件版本冲突的处理方法。分享给大家供大家参考，具体如下： jQuery 的某个插件 当有多个版本同时可能会有冲突，导致代码错误 参考typeahead的处理方法，可以在插件中增加noconflict 方法来解决这个问题(在进入版本的时候讲老版本保存，退出的时候还原老版本) demo如下： <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><script src="jquery.js"></script> </head> <body> <div class="contai...
本文实例讲述了jQuery插件扩展操作。分享给大家供大家参考，具体如下： 如下DEMO 展示了为dom扩展一个myshowHtml 的方法 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><script src="jquery.js"></script> </head> <body> <div class="container">你好 </div> <script>(function ($) {$.fn.myshowHtml = function(){alert(this.html());}})(window.jQuery) $(function(){$(".container").myshowHtml(); }) </scri...
一个基于jQuery的气泡动画插件，在指定区域上方（左/右）定时间隔产生气泡，然后随机水平速度进行仿自由落体运动。到达区域底部之后做弹跳运动，速度逐渐衰减。直至停止运动。在线演示 安装方法 由于是基于jQuery的扩展插件，因此引入jQuery是必须的。 此外，还需引入插件自身的实现脚本。 <scriptsrc="https://code.jquery.com/jquery-1.12.4.min.js"></script> <scriptsrc="../js/jquery.bubble.min.js"></script>在此之前，我们...
本文实例讲述了jQuery插件JWPlayer视频播放器用法。分享给大家供大家参考，具体如下： JWPlayer 插件播放视频播放器 使用方法： <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ page contentType="text/html; charset=UTF-8"%> <!DOCTYPE html> <html> <head><meta charset="UTF-8"><meta content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no" name="viewport"/><meta co...
ajaxFileUpload.js 很多同名的，因为做出来一个很容易。 我用的是这个：https://github.com/carlcarl/AjaxFileUpload 下载地址在这里：http://xiazai.jb51.net/201701/yuanma/ajaxfileupload(jb51.net).rarAjaxFileUpload.js并不是一个很出名的插件，只是别人写好的放出来供大家用，原理都是创建隐藏的表单和iframe然后用JS去提交，获得返回值。 当初做了个异步上传的功能，选择它因为它的配置方式比较像jQuery的AJAX，我很喜欢。 ...
上一篇介绍了DataTable，这一篇在DT的基础之上再使用jquery的一款插件：treegrid,官网地址：http://maxazan.github.io/jquery-treegrid/ 一、使用treegrid，需要以下支持 jquery.min.js+jquery.treegrid.min.js 二、后端提供树状列表格式的集合数据，借助前端的DT的配置控制，来在页面上输出满足treegrid格式要求的html 前台： @using Model @{Layout = null;UserInfo userInfo = null;if (ViewData["LoginUser"] != null){userInf...
上一篇随笔提到了MvcPager,最近用到了一款前端JQ插件------DataTable（简称DT），很好用。 DT是一款前端插件，和后端完全分离开，就这点来看，我就特别喜欢。 一.使用DT，需要以下支持js:jq+jquery.dataTables.min.js 二、页面上进行引入js，直接使用DT功能 前端代码：<!DOCTYPE html><html> <head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=d...
本篇的由来是群里面某个朋友提到说：有没有一个倒计时的特效，格式如分钟：秒；由此思考了下，觉得弄几个常用效果的js小插件还是不错的，可以供大家学习和使用，这里我取名为：shenniu.effect.js；希望大家喜欢，多多点赞支持： . 时钟效果 . 倒计时 . 全选效果 . tab点击切换 . tab鼠标移动切换 . 文本输入搜索 . 几个常用table展示方式插件 . 列表插件shenniu.pager.js 下面一步一个脚印的来分享： 首先，先发个线上测试地址love...
Bootstrap Validator是为Bootstrap3设计的一款表单验证jQuery插件，非常适合基于Bootstrap框架的网站。 看作者的github，这款插件已经不再更新了，而推荐使用FormValidation，不过现在还是先介绍一下BootstrapValidator的使用。 准备工作 BootstrapValidator文档地址：http://bv.doc.javake.cn/ 下载源码后，将其中的bootstrapValidator.min.css和bootstapValidator.min.js导入项目，并在页面中引入这些组件，如下： <link rel="s...
<body><div class="container demo"><div class="big"><p class="instructions">大图预览</p><div class="bigframe"><img width="300" height="300" src="images/resized_pic.jpg" alt="" /></div></div><div class="small"><p>小图缩放</p><div class="smallframe" ><div class="pre" id="preview"><img src="images/resized_pic.jpg" alt="" /></div></div></div></div> </body>先总结一下：最近练手，写了一些小东西，都是网上已...
这个应用的关键：1.让左边选择区域和右边显示的图像信息保持一至。2.根据左边选择区域的大小，来让右边有一个对局部放大或缩小的效果。 3.后台上传功能。那么这一次，只谈[放大]或[缩小]。[位置]和[上传]问题，下次，我再写下(因为那个插件代码太多，我也没看完，正在学习研究当中)。 ［"区域"：是宽*高，也就是面积；] ［"放大或缩小"：是一个比例值，通常我们说放大或缩小，都说放大或缩小百分之多少，或者说放大或缩小多少倍...
本文实例讲述了jQuery插件扩展的方法。分享给大家供大家参考，具体如下： <script language="javascript" type="text/javascript"> function doSomething(callback) {// … // Call the callbackcallback(stuff, goes, here); // 给callback赋值，callback是个函数变量 } function foo1(a, b, c) {// Im the callbackalert(a + " " + b + " " + c); } doSomething(foo1); // foo1函数将使用callback函数中的数据 stuff goes here v...
jQuery插件开发 一般来说，jQuery插件的开发分为两种：一种是挂在jQuery命名空间下的全局函数，也可称为静态方法；另一种是jQuery对象级别的方法，即挂在jQuery原型下的方法，这样通过选择器获取的jQuery对象实例也能共享该方法。 一、jQuery扩展1、$.extend(object)类似于.Net的扩展方法，用于扩展jQuery。然后就可以用$.的方式调用。$(function(){$.extend({ fun1: function () { alert("为jQuery扩展一个fun1函数!"); } });$....