前端开发中，进度条库是常见的库之一，bootstrap中提供了多种进度条样式，其中NProgress.js是一款轻量级的进度条组件，使用简便。NProgress可实现的进度条效果，如下图所示。 官网下载NProgress网址：http://ricostacruz.com/nprogress/下载如下所示文件【nprogress.css】与【nprogress.js】： 使用方法：（1）引入nprogress.js和nprogress.css到项目中（2）调用start() 和 done()来控制进度条NProgress.start(); //进度条开始NPro...
方式1：$.fn.extend(object)<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>01-jQuery对象进行方法扩展</title> <script src="../js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> //定义jquery的对象插件 $.fn.extend({ //定义了一个checkFn方法，所有的jq对象都可以使用该方法 check:function(){ ...
恩，不知道之前在哪看过一个页面效果就是如果页面被滑动了就出现一个小火箭，点击这个小火箭就可以慢慢回到页面顶部，闲的没事，自己搞了一下代码和布局都很简单<!DOCTYPE HTML><html><head><style>#content{height: 2000px ;width: 960px ;margin: 0 auto ;background-color: blue ;}#rocket{width: 50px ;height: 50px ;position: fixed;right: 10px ;bottom: 10px ;display: none;}#rocket img{width: 100%;height: 100%;}</sty...
项目上线了，在测试的时候突然发现一次性加载庞大的树结构，导致页面卡死，需要反映数十秒才能加载完成，考虑不周，决定修改程序，在网上发现了这篇文章，感谢作者的分享！zTree结合Asp.net实现异步加载数据 实现简单操作zTree 下载 api 访问 ：http://www.ztree.me/v3/main.php例子中用到json数据转化 newtonsoft 地址 ： http://json.codeplex.com/不多说，代码如下 :aspx 页面 ：<%@ Page Language="C#" AutoEventWireup="true"...
<a title="收费用户" class="normal2 fancybox.iframe" href="/backmanage/userDate?mail=‘+dat[i]["nvcEmail"]+‘" target="_blank"><span class="color1">${user.username}</span></a> $(".normal2").fancybox({‘width‘:‘60%‘,‘height‘:‘80%‘,‘autoSize‘ : false,‘autoCenter‘ :true}); 原文：http://www.cnblogs.com/phyxis/p/5295270.html
手风琴效果经常会用在网页左侧的导航栏，当导航内容比较多时使用手风琴的展示方式更有利于信息的传递和排版，下面就分享一个自己制作的简易手风琴效果，没有用图片，背景颜色也是随意设定的，在实际项目中大家可适当修改。效果图：实现原理：1、当鼠标点击span标签（即一级导航）时，先判断子目录li是否已经展开（此处使用一个on类来做标记）； 2、如果是，则收缩当前的li，移出on类标记，修改span右边的提示符为加号； 3、如果不是...
实现这样一个基本需求，页面有很多数据，可以删除一条或多条，删除前判断是否选中至少一条，否则提示。function deleteUser() { //当时是想把内容以str+=""的方式 进行保存 ，但不行//var str;var array = new Array(); //用于保存 选中的那一条数据的IDvar flag; //判断是否一个未选$("input[name=‘selectFlag‘]:checkbox").each(function() { //遍历所有的name为selectFlag的 checkboxif ($(this).attr("checked")) { //判断是...
jQuery实现下拉菜单一、居中1、块元素居中：给块元素本身设置：margin:0 auto;，块元素必须设置宽度2、行内块元素居中：给元素父级设置text-algin:center; 1<!DOCTYPE html> 2<html lang="en"> 3<head> 4<meta charset="UTF-8"> 5<title>Title</title> 6<style> 7 *{ 8 margin: 0; 9 padding: 0; 10 list-style: none; 11} 12 .nav{ 13 width: 100%; 14 ...
http://www.imooc.com/code/3403如果jQuery没有插件接口的设计，那么他就像个光杆司令没有兵，就是没有手下，只有自己一个封闭的城堡。因此jQuery城堡需要设计一个大门 - 插件接口，从而打开大门开始招兵买马。当然jQuery除了获得“开发者社区”的大力支持外，也有很多大公司纷纷对它投出了橄榄枝，这也是它成功的关键。 基于插件接口设计的好处也是颇多的，其中一个最重要的好处是把扩展的功能从主体框架中剥离出去，降低了...
后台管理中总是使用frameset进行分成部分进行管理，但是感觉很不好用，尤其是页面间调转还要判断window.parent，太令我费神了，于是学习使用XMLHttpRequest进行页面局部刷新。代码如下：Java代码 <html> <head> <script type="text/javascript"> window.onload = function(){ document.getElementById("email").onblur = function(){ if(window.XMLHttpRequest){ ...
连载：（三）循序渐进，通过XML配置，实现通用于WinForm（.Net）、WebForm（Asp.Net+JQuery+EasyUI）表单、报表--XML控制文件作者：长江支流 本章，将给出控制文件相关类的C#.Net源代码，包括控制文件主控类WebMisController、以及控制文件的组成部分表单及清单过滤字段Field类、回调函数类CallbackFun。 控制文件控制文件由WebMIS.ServiceModel.WebMisController/ WebMisControllerSerializer类去描述和解析。 ...
对一个简单的ul列表进行输入框的搜索功能，搜索之前及搜索后显示效果如下：用到的主要jquery技术有filter()和match()方法以及正则匹配，基础HTML+div设置：<div class="nav_Element_Item "> <h2>数据名称:</h2> <div class="data_search_div"> <input class="data_search_input" type="text" placeholder="请输入数据名称查找"></div> <ul class="nav_Element_List"> <li>基金简称</li> <li>董事会成员</li> <li>数据名称</li> <li...
项目需求：在ie或chrome浏览器下，调用电脑摄像头（确保使用的是笔记本电脑，或者摄像头功能正常使用的台式机），进行人脸图像采集预览，并将图片的base64码传入到后台进行后续操作。该demo适用于chrome和ie10以上，ie10以下版本的未测试。前期插件准备jquery：1.5版本以上即可jquery-webcam：github地址, 作者主页地址这里。该插件下载好后我们需要如下四个文件并与下面测试的HTML放在同一目录下：测试页面测试前注意事项: 测试ht...
1.引入jQuery文件2.添加jquery.refresh.js文件，代码如下： 1/**2 * Created by Silver on 2015/11/27.3*/ 4 5 (function ($) {6 $.refreshData = function (options) {7var defaults = {8 url: ‘/order/ajax_new_count‘,//提交的地址 9 contentData: {}, 10 time: 15, 11 home: false12 }; 13var opts = $.extend({}, defaults, options); 1415 $.refreshDat...
昨天做项目遇到一个问题，和大家分享下，jquery实现点击按钮弹出层和点击空白处隐藏层的问题if($(‘.autoBtn‘).length){ $(‘.autoBtn‘).find(‘.assess‘).unbind().bind(‘click‘,function(event){ //取消事件冒泡 event.stopPropagation(); if($(‘.abtnBox‘).is(":hidden")){ $(‘.abtnBox‘).show(); ...