基于jquery 的dateRangePicker 和 My97DatePicker

引入相应的date插件 <script type="text/javascript" src="../plugins/daterangepicker/moment.min.js"></script> 日期范围插件 <script type="text/javascript" src="../plugins/daterangepicker/jquery.daterangepicker.js">…

基于JQuery的获取鼠标进入和离开容器方向的实现

做动画时,需要判断鼠标进入和退出容器的方向.网上找到的基于JQuery的实现方法,用函数封装了一下,写了一个示例.注意绑定鼠标事件用的是on(),所以JQuery版本需高于1.7. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>判断鼠标从哪个方向进入和离开容器</title> <script src="js/jquery-3.…

基于jQuery的Validate表单验证

表单验证可以说在前端开发工作中是无处不在的~ 有数据,有登录,有表单, 都需要前端验证~~ 而我工作中用到最多的就是基于基于jQuery的Validate表单验证~ 就向下面这样~ 因为今天有个朋友问我要一个表单的验证,所以我就稍微整理了一下~ 基本上有了这个表单验证插件,基本上一些常用的验证都可以搞定了~ 如果搞不定,没关系,我们还可以基于Validate来写一个自己的验证插件, 我把它取名为message_zh.js,我们可以在里面扩展自己需要的验证~~ 既然Validate是基于jQ…

基于jQuery的自适应图片左右切换

效果预览:http://hovertree.com/code/jquery/smjv6d0n.htm 基于jQuery编写的横向自适应幻灯片切换特效全屏自适应jquery焦点图切换特效,在IE6这个蛋疼的浏览器兼容性问题上得到了和谐,兼容IE6. 适用浏览器:IE6.IE7.IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗. 代码如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1…

使用 Sticky-Kit 实现基于 jQuery 的元素固定效果

元素固定效果在网页中应用得很多,比较常见的使用场景有改进导航,显示广告.Sticky-Kit 是一个非常方便的 jQuery 插件,简化了创建/管理粘元素,有复杂的使用功能.这些功能包括:处理多个固定元素,启用/禁用的行为取决于对元素在视口中的位置和回调.它也有一个函数重新计算尺寸,从而简化了在浏览器调整大小时的使用. 您可能感兴趣的相关文章 jQuery Wheel Menu:漂亮的 Path 风格旋转菜单 UIkit – 轻量前端框架,帮助你快速构建 Web 界面 FancySelect –…

基于jquery的bootstrap在线文本编辑器插件Summernote

Summernote是一个基于jquery的bootstrap超级简单WYSIWYG在线编辑器.Summernote非常的轻量级,大小只有30KB,支持Safari,Chrome,Firefox.Opera.Internet Explorer 9 +(IE8支持即将到来). 特点: 世界上最好的WYSIWYG在线编辑器极易安装开源自定义初化选项支持快捷键适用于各种后端程序言语使用方法使用html5文档 <!DOCTYPE html> <html> ... </h…

模仿iframe框架，由分隔栏动态改变左右两侧div大小———基于jQuery

<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>分隔栏动态改变div大小-基于jQuery</title> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> <meta…

基于jquery fly插件实现加入购物车抛物线动画效果,jquery.fly.js

在购物网站中,加入购物车的功能是必须的功能,有的网站在用户点击加入购物车按钮时,就会出现该商品从点击出以抛物线的动画相似加入购物车,这个功能看起来非常炫,对用户体验也有一定的提高.下面介绍基于jquery fly插件实现加入购物车抛物线动画效果.使用jquery.fly插件很方便时实现抛物线动画加入购物车的功能一.插件下载插件官方:https://github.com/amibug/fly 二.载入jQuery库文件和jquery.fly.min.js插件 <script src="j…

模仿win10样式，基于jquery的时间控件

工作需要,写了一个基于jquery的时间控件,仿win10系统时间控件格式. 目前基本功能都有了,但时间格式只实现少数,但由于结构设计已经充分优化,填充起来非常容易. 这个控件相对网上其他的时间控件,代码少,易阅读,修改拓展方便,也适合新手参考学习. if (typeof jQuery === 'undefined') { throw 'no jquery'; } (function () { window.UE_CONTROL_IDX = 0; $.fn.GetRect = function…

基于jQuery的ajax对WebApi和OData的封装

基于jQuery的ajax对WebApi和OData的封装 WebApi 的使用带来了一个显著的特点,对type有一定的要求.一般ajax的type无非就是两种,GET和POST.如果用JSONP来跨域的话,就只能用GET.但是现在WebApi来了,type的类型增加了一倍还要多.这个虽说问题不大,就是多个put.delete,看看要求掌握一下就可以了.但是我觉得,这个总是要有个过程,另外写代码的时候还要想想是put还是post,万一写错了,就会带来不必要的麻烦.那么能不能封装一下呢? jQue…

【分享】纯js的n级联动列表框 —— 基于jQuery，支持下拉列表框和列表框，最重要的是n级，当然还有更重要的

多个列表框联动,不算是啥大问题,但是却挺麻烦,那么怎么才能够尽量方便一点呢?网上搜了一下,没发现太好用的,于是就自己写了一个.基于jQuery,无限级联动,支持下拉列表框和列表框. 先说一下步骤和使用方法: 1.在页面里设置列表框城市:<select name="c5118020" id="ctrl_001" > <option value="-99999">请选择</option><option va…

基于 jQuery 实现的精致作品集图片导航效果

今天,我们要用 jQuery 来创建一个作品集图像的导航模板.我们的想法是,以分组的方式显示一组作品集,并通过二维的方式(水平/垂直)来浏览.任一箭头或当前图像下方的小盒子可以作为导航使用. 在线演示下载源码您可能感兴趣的相关文章网站开发中很有用的 jQuery 效果[附源码] 分享35个让人惊讶的 CSS3 动画效果演示十分惊艳的8个 HTML5 & JavaScript 特效 Web 开发中很实用的10个效果[源码下载] 12款经典的白富美型 jQuery 图片轮播插件本文…

基于 jQuery 实现垂直滑动的手风琴效果

今天我们要与大家分享一个漂亮而灵活的垂直 jQuery 手风琴效果.其主要思想是扩大手风琴片上的点击和显示更多的信息.其他内容片段将变得不那么透明.当使用一个导航箭头导航下一个片段,新的片会从顶部或底部滑动. 效果演示插件下载 HTML 示例代码: <div id="va-accordion" class="va-container"> <div class="va-nav"> <span class=&q…

编写基于jQuery的插件的方法

注意:jQuery中有一个extend的方法,这个方法是添加js对象字段的,下面会多次用到 1:添加全局类的方法常用的ajax就是该类插件,下面要编写一个简单的加法和减法的基于jQuery的方法 $.extend({ add:function(a,b){return a+b;}, minus:function(a,b){return a-b;} }); var i= $.add(100,200); var j= $.minus(100,200); alert(i+'##'+j); 第6行和第7…

基于JQuery.timer插件实现一个计时器

基于JQuery.timer插件实现一个计时器,需要的朋友可以参考下. 先去官网下载jQuery Timers插件 ,然后引用到html中.这里是1.2 version 复制代码代码如下: <script src="../Javascripts/Plugins/jquery.timers-1.2.js" type="text/javascript"></script> 然后是HTML,我们可以放一个hidden 的server cont…

【jquery】基于 jquery 实现 ie 浏览器兼容 placeholder 效果

placeholder 是 html5 新增加的属性,主要提供一种提示(hint),用于描述输入域所期待的值.该提示会在输入字段为空时显示,并会在字段获得焦点时消失.placeholder 属性适用于以下类型的 input 标签:text, search, url, telephone, email 以及 password. 我们先看下在谷歌浏览器中的效果,如图所示: 获得焦点时: 输入字段: 因为是 html5 属性,自然低版本的浏览器比如 ie6-8 不兼容.下面就介绍下如何在低版本浏览器中…

基于jQuery的input输入框下拉提示层(自动邮箱后缀名)

基于jQuery的input输入框下拉提示层,方便用户输入邮箱时的提示信息,需要的朋友可以参考下效果图 // JavaScript Document (function($){ $.fn.extend({ "changeTips":function(value){ value = $.extend({ divTip:"" },value) var $this = $(this); var indexLi = 0; //点击document隐藏下拉层 $…

基于jQuery点击加载动画按钮特效

分享一款基于jQuery点击加载动画按钮特效.这是一款基于jQuery+CSS3实现的鼠标点击按钮加载动画特效代码.效果图如下: 在线预览源码下载实现的代码. html代码: <div class="container"> <div class="row"> <div class="col-md-6 col-md-offset-3 text-center"> <p> <button c…

基于jQuery HTML5人物介绍卡片特效

基于jQuery HTML5人物介绍卡片特效.这是一款基于jquery.material-cards插件实现的人物介绍卡片形式特效代码.效果图如下: 在线预览源码下载实现的代码. html代码: <div class="htmleaf-container"> <br> <section class="container"> <div class="row active-with-click">…

基于jQuery右下角旋转环状菜单代码

基于jQuery右下角旋转环状菜单代码.这是一款固定在页面的右下角位置,当用户点击了主菜单按钮后,子菜单项会以环状旋转进入页面,并使用animate.css来制作动画效果.效果图如下: 在线预览源码下载实现的代码. html代码: <div class="htmleaf-container"> <div id='ss_menu'> <div> <i class="fa fa-qq"></i> <…

基于jquery的相册预览gallery

众多有图片的产品,都要加个图片预览功能.然后市面上就出现了各种各样的相册,下面也提供一个基于jquery的相册. 源码:https://github.com/lilyH/gallery 版本: v0.1版功能:(1)支持鼠标点击,键盘左右的图片下一张,下一张 (2)支持屏幕缩放的时候,重新计算图片的位置,保证图片位置屏幕的中间样子: 功能还比较简单,希望自己能坚持一直修改下去...…

基于JQuery实现滚动到页面底端时自动加载更多信息

基于JQuery实现滚动到页面底端时自动加载更多信息关键代码: 代码如下: var stop=true; $(window).scroll(function(){ totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop()); if($(document).height() <= totalheight){ if(stop==true){ stop=false; $.post("ajax.…

基于 jQuery Jcrop 插件的功能模块：头像剪裁

/** Jcrop version: 0.9.12 jQuery version: 1.9.0 Author: 小dee Date: 2014.10.30 */ 先看看他山之石:博客园的头像模块也是使用的 Jcrop 插件,处理方式如图博客园图1: 高度大于宽度时博客园图2: 再看看新浪微博( http://account.weibo.com/set/photo ),它使用的是 flash,如图: 最后看豆瓣( http://www.douban.com/accounts/user_icon…

基于jQuery的移动轮播图（支持触屏）

移动轮播图我看到两款, 一款是无线天猫的m.tmall.com,实现了无缝轮播. 一款是蘑菇街的,没有实现无缝轮播. 我自己重写一个,类似蘑菇街 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>基于jQuery的移动轮播图(支持触屏)</title> <style type="text/c…

基于jQuery打造的选项卡向上弹出jquery焦点图切换特效

基于jQuery打造的选项卡向上弹出jquery焦点图切换特效鼠标经过标题栏,会出现层特效向上滑动,并且在同时进行幻灯片切换,效果十分不错. 有兴趣的童鞋可以下载看看,在IE6方面兼容性也不错,只有处理IE6下透明图片还不怎么到位, 大家可以看看本站的IE6的PNG透明图片处理方法,综合起来完善这个特效,大家多动动手.http://www.jqshare.com/Jq/fondone/id/13.html 效果图如下: 特效下载地址:http://www.jqshare.com/Jq/fond…

基于jQuery编写的横向自适应幻灯片切换特效

基于jQuery编写的横向自适应幻灯片切换特效全屏自适应jquery焦点图切换特效,在IE6这个蛋疼的浏览器兼容性问题上得到了和谐,兼容IE6. 适用浏览器:IE6.IE7.IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗. 相关代码: <script type="text/javascript"> jQuery(".fullSlide").hover(function() { jQuery(this).fi…

基于jQuery的视频和音频播放器jPlayer

jPlayer见网络上资料很少,官方英文资料太坑爹TAT,于是就写一个手记给大家参考下.据我观察,jPlayer的原理主要是用到HTML5,在不支持HTML5的浏览器上使用SWF.做到全兼容,这一点很不错.官方还说明,服务器对于MP3文件不要做GZIP压缩,只是徒增CPU而已.并且在Flash播放GZIP的MP3时会出错. jPlayer简介: 想在网页上播放背景音乐,不想用html标签的方式,因为那样只有音乐全部下载完以后才能播放,还容易出现跨浏览器兼容性的问题,于是选了一款基于jQuery的…

基于jQuery 常用WEB控件收集

Horizontal accordion: jQuery 基于jQuery开发,非常简单的水平方向折叠控件. Horizontal accordion: jQuery jQuery-Horizontal Accordion 具有XBOX360 blade界面风格的水平方向Accordion. jQuery-Horizontal Accordion AutoComplete-JQuery jQuery插件易于集成到现在的表单中(Form). AutoComplete-JQuery Facebook…

10 个基于 jQuery 的 Web 交互插件推荐

英文原文:10 jQuery for Web Interaction Plugins “用户交互”在现代的 Web 设计中占据了很大比例,这是互联网产品不可或缺的关键,对 Web 设计师也提出了更高的要求. 本文整理了 10 款基于 jQuery 的 Web 交互插件,可以帮助你提高工作效率,或带给你一些设计灵感. 1. Redactor:奇妙的所见即所得编辑器该工具有一个非常好的 API,允许你根据需要进行定制. 源码 / 演示 2. elFinder:基于 web 的文件管理工具…