- 浏览: 486838 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
caipeiming:
可以使用array的indexOf方法,参考JavaScrip ...
js-判断元素是否存在于array数组中 -
zhangyaochun:
这个不错,新属性哦~
html5新特性-- <a>标签新属性download -
housheng33:
空间和时间星型-雪花-ER一范式-二范式-三范式
浅谈多维模型 -
housheng33:
对不起,我已经24岁了。我已经没有能力和你谈那一场天真而不计得 ...
对不起,我已经24岁了。我已经没有能力和你谈那一场天真而不计得失的恋爱了。 -
zhangyaochun:
这篇整理的不错
js-清空array数组
优点:右下角弹出同时可配置对应的开始和结束的animated的效果
缺点:没有对外的api支持例如控制显示和隐藏
附件1:css默认样式源码
附件2:jquery插件源码
缺点:没有对外的api支持例如控制显示和隐藏
<script type="text/javascript" src="jquery-popMessage.js"></script> <script type="text/javascript"> $(function(){ $.fn.popMessage({ content : '<a href="#" class="ime-btn"></a>', height:282, auto:false, width:280, html:true, openAnimType:{'type':'slideDown','speed':'slow'}, closeAnimType:{'type':'fadeOut','speed':'slow'} }); }); $('#test').click(function(){ $('.Pop-Message-container').hide(200); });//利用jquery手动添加隐藏显示 </script>
附件1:css默认样式源码
@charset "utf-8"; .Pop-Message-container{background:url(../images/wke-dialog-panel_title.png) repeat;position:absolute;right:0px;border:1px solid #ccc;box-shadow:3px 3px 3px rgba(0, 0, 0, 0.2);border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;} .Pop-Message-title{color:#7297a9;height:26px;line-height:22px;position:relative;padding:10px;padding-bottom:0;border-bottom:1px solid #ccc;} .Pop-Message-close,.Pop-Message-close-hover{background:url(../images/wke-dialog-panel_tools.gif) no-repeat scroll -16px 0;width:16px;height:16px;position:absolute;top:10px;right:10px;filter:alpha(opacity=60);opacity:0.6;-moz-opacity:0.6;cursor:pointer;} .Pop-Message-close-hover{opacity:1;filter:alpha(opacity=100);-moz-opacity:1;} .Pop-Message-con{background:url(../images/con_bg.png) no-repeat #fff;} .ime-btn,.ime-btn-hover{background:url(../images/btn.png) no-repeat;height:29px;width:91px;display:inline-block;position:absolute;left:100px;top:273px;} .ime-btn:hover{background:url(../images/btn-hover.png) no-repeat;} .Pop-Message-body{padding:10px;} .Pop-Message-footer{height:25px;border-top:1px solid #ccc;padding:10px 0 0 10px;color:#7297a9;} .noNotice{margin-left:5px;}
附件2:jquery插件源码
(function(){ /*设计定位为作为一般的插件*/ $.extend($.fn,{ popMessage : function(options){ //合并配置 options = $.extend({},$.fn.popMessage.defaults,options); //render container var container = $('<div></div>').addClass('Pop-Message-container').css({'width':options.width,'display':'none','height':'auto','zIndex':options.zIndex}); //这边为了防止ie6下select的遮盖问题 //思路是判断是否加载了jquery.bgiframe.js if($.fn.bgiframe){ container.bgIframe(); } //title var title = $('<div></div>').addClass('Pop-Message-title').appendTo(container); title.text(options.title); //conWrap //更改策略可以设置高度 但是container还是auto的设置的是conWrap的高度 var conWrap = $('<div></div>').addClass('Pop-Message-con').appendTo(container).css('height',options.height != 'auto' ? options.height : 'auto'); //messageBody var messageBody = $('<div></div>').addClass('Pop-Message-body').appendTo(conWrap); //增加一个尾部 var footer = $('<div></div>').addClass('Pop-Message-footer').appendTo(container); //footer的具体 var footerCon = $('<input type="checkbox" class="" /><span class="noNotice">下次不在提醒</span>').appendTo(footer); //判断是否支持远程调用 if(options.loadUrl != ''){ messageBody.load(options.loadUrl); }else{ if(options.html){ messageBody.html(options.content); }else{ messageBody.text(options.content); } } //关闭按钮 if(options.closeBtn){ var closeBtn = $('<span></span').addClass('Pop-Message-close').appendTo(title).hover(function(){ $(this).addClass('Pop-Message-close-hover'); },function(){ $(this).removeClass('Pop-Message-close-hover'); }).click(function(){ //其实就是调用关闭的api closeMessage(); }); } //计算右下角 var interval = setInterval(function(){ var h = (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) +document.documentElement.clientHeight -container.height() -12; if(h < document.body.offsetHeight){ container.css('top',h+ 'px'); }else{ container.css('top',document.body.offsetHeight+ 'px'); } },20); //最后在appendTo container.appendTo($(document.body)); //初始显示 if(options.openAnimType){ switch(options.openAnimType.type){ case 'slideUp': container.slideUp(options.openAnimType.speed); case 'slideDown': container.slideDown(options.openAnimType.speed); case 'show': container.show(options.openAnimType.speed); case 'fadeIn': container.fadeIn(options.openAnimType.speed); }; } /*container.slideDown('slow');*/ //关闭 function closeMessage(){ if(options.closeAnimType){ switch(options.closeAnimType.type){ case 'slideDown': container.slideDown(options.closeAnimType.speed); case 'slideUp': container.slideUp(options.closeAnimType.speed); case 'hide': container.hide(options.closeAnimType.speed); case 'fadeOut': container.fadeOut(options.closeAnimType.speed); }; } /* container.slideUp('slow');*/ } //是否自动关闭 if(options.auto){ setTimeout(function(){ closeMessage(); clearInterval(interval); //container.remove(); },options.time); } } }); /*默认设置*/ $.fn.popMessage.defaults ={ title : '提醒', content : '您有新的提醒', closeBtn: true, //关闭按钮是否默认显示 width : 250, height: 'auto', //规则目前为了适应高度最后的效果是设置内容区域的高度 zIndex: 10000, loadUrl:'', //远程调用 html: false, //支持html语义化的内容,默认关了 openAnimType:{'type':'slideUp','speed':'slow'}, //支持开始的动画配置 closeAnimType:{'type':'hide','speed':'slow'}, //支持结束的动画配置 auto:true, //自动关闭 time:4000 //定时 }; })(jQuery) /*考虑到scroll*/ $(window).scroll(function(){ var topHeight = (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) +document.documentElement.clientHeight -$('Pop-Message-container').height() -12; if(topHeight < document.body.offsetHeight){ $('Pop-Message-container').css('top',topHeight+ 'px'); }else{ $('Pop-Message-container').css('top',document.body.offsetHeight+ 'px'); } });
- jquery-dialog.rar (372.8 KB)
- 下载次数: 13
发表评论
-
jquery插件之--TableDnD plugin
2015-05-07 18:41 0http://www.jqueryscript.net/dem ... -
jquery插件之--autocomplete
2015-05-07 18:40 603jQuery.Autocomplete 能够很好的实现输入框的 ... -
jquery选择器匹配方式
2015-04-07 19:49 590一直了解jQuery的优势之一是支持强大的 ... -
清空dom源码解析
2015-04-04 17:06 548jquery中empty()是采用逐个移除子元素实现的 zep ... -
Jquery方法-is()检测匹配元素集合
2015-04-01 16:08 675.is( selector ) 判断当前匹配的元素 ... -
类数组转换为数组makeArray()
2015-04-01 11:01 1161面试的时候遇到这个问题,在jquery中如何实现的将 ... -
jQuery.data()和html5 dataset
2015-03-26 16:33 1183我们先来看下HTML 5 增加的一项新功能是自定义数据 ... -
jquery插件之-图片放大镜
2015-03-26 10:17 865(一)mlens图片放大镜 尊重原创:http://www.j ... -
利用unique()去重和merge()合并数组
2015-03-24 14:28 4345$.unique() jQuery.unique(array ... -
jQuery.ajax 执行异步请求
2015-03-23 15:34 996jQuery.ajax( url [, settings ] ... -
jQuery插件开发入门
2015-03-19 16:09 805是什么? 所谓“插件”,就是用户自己新增的jQuery ... -
Jquery.extend()
2015-03-19 15:12 619var object = $.extend({}, objec ... -
jquery匹配元素替换目标元素
2015-03-04 10:47 613DOM树结构如下: <div class="c ... -
jquery-元素属性操作
2015-03-03 17:33 578attr(attributeName) 或者attr(attr ... -
jquery-one()
2015-02-13 16:06 711one() 为被选元素附加一个或多个事件处理程序,并规定当事件 ... -
jquery-map()遍历
2015-02-12 15:52 5660map() 把每个元素通过函数传递到当前匹配集合中,生成包含返 ... -
parseJSON()方法
2015-02-10 16:14 681jQuery.parseJSON(json) 将要解析的 J ... -
jquery-ajax get()和post()
2015-02-06 16:21 814get( url [,data][,success(data, ... -
jquery-ajaxStart()和ajaxStop()
2015-02-06 11:41 733ajaxStart()和ajaxStop()方法是绑定Ajax ... -
jquery ajax $.param()方法序列化字符串
2015-02-05 16:45 964jQuery.param( obj )将表单元素的值转换为序列 ...
相关推荐
popmessage参考html页面
以popup小窗口技术实现实时提醒,类似于div形式弹出框。
考研管理类联考综合能力答案解析,考研真题,考研历年真题,考研管理类联考历年真题,真题解析。
matplotlib绘图 通过 Matplotlib,开发者可以仅需要几行代码,便可以生成绘图、直方图、功率谱、条形图、错误图、散点图等。 Matplotlib基础知识 1.Matplotlib中的基本图表包括的元素 x轴和y轴 水平和垂直的轴线 x轴和y轴刻度 刻度标示坐标轴的分隔,包括最小刻度和最大刻度 x轴和y轴刻度标签 表示特定坐标轴的值 绘图区域 实际绘图的区域 2.hold属性 hold属性默认为True,允许在一幅图中绘制多个曲线;将hold属性修改为False,每一个plot都会覆盖前面的plot。 但是不推荐去动hold这个属性,这种做法(会有警告)。因此使用默认设置即可。 3.网格线 grid方法 使用grid方法为图添加网格线 设置grid参数(参数与plot函数相同) .lw代表linewidth,线的粗细 .alpha表示线的明暗程度 4.axis方法 如果axis方法没有任何参数,则返回当前坐标轴的上下限 5.xlim方法和ylim方法 除了plt.axis方法,还可以通过xlim,ylim方法设置坐标轴范围
毕业设计:基于微信小程序大学校园二手教材与书籍拍卖系统(源码 + 数据库 + 说明文档) 毕业设计:基于微信小程序大学校园二手教材与书籍拍卖系统(源码 + 数据库 + 说明文档) 第二章 需求分析 4 2.1可行性分析 4 2.1.1技术的可行性 4 2.1.2经济的可行性 4 2.1.3操作可行性 4 2.2需求调研 4 第三章 数据库设计 6 3.1数据库的分析与设计 6 3.1.1数据库的概念结构设计 6 3.1.2数据表的逻辑结构设计 7 第四章 系统功能实现 8 4.1 系统后台界面 8 4.2书籍类别管理 8 4.3 书籍信息界面 9 4.4竞拍管理界面 9 4.5 微信小程序首页 9 4.6书籍信息添加 10 4.7书籍竞拍界面 11 4.8用户后台界面 11 第五章 系统测试 12 5.1 系统测试的意义 12 5.2 系统测试的内容 12 5.3系统测试结果 12 总结 13
利用openCV控制单片机小车运动轨迹.zip
基于Python的PCA人脸识别算法的原理及实现代码+文档详解.zip个人经导师指导并认可通过的98分课程设计项目,主要针对计算机相关专业的正在做课程设计、期末大作业的学生和需要项目实战练习的学习者。
JAVA学生成绩管理系统.rarJAVA学生成绩管理系统.rarJAVA学生成绩管理系统.rar
详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;
基于51单片机的智能车控制板.zip
考研管理类联考综合能力答案解析,考研真题,考研历年真题,考研管理类联考历年真题,真题解析。
matplotlib绘图 通过 Matplotlib,开发者可以仅需要几行代码,便可以生成绘图、直方图、功率谱、条形图、错误图、散点图等。 Matplotlib基础知识 1.Matplotlib中的基本图表包括的元素 x轴和y轴 水平和垂直的轴线 x轴和y轴刻度 刻度标示坐标轴的分隔,包括最小刻度和最大刻度 x轴和y轴刻度标签 表示特定坐标轴的值 绘图区域 实际绘图的区域 2.hold属性 hold属性默认为True,允许在一幅图中绘制多个曲线;将hold属性修改为False,每一个plot都会覆盖前面的plot。 但是不推荐去动hold这个属性,这种做法(会有警告)。因此使用默认设置即可。 3.网格线 grid方法 使用grid方法为图添加网格线 设置grid参数(参数与plot函数相同) .lw代表linewidth,线的粗细 .alpha表示线的明暗程度 4.axis方法 如果axis方法没有任何参数,则返回当前坐标轴的上下限 5.xlim方法和ylim方法 除了plt.axis方法,还可以通过xlim,ylim方法设置坐标轴范围
基于Java的银行排号系统的设计与实现
STM32电子琴-DigitalPiano-STM32 介绍 用STM32f103c8t6、标准库和C语言制作的电子琴,发声单元使用无源蜂鸣器,基于PWM方法控制音调,支持高、低两个阶段的音调。 支持演奏模式、录制模式和播放录制模式。 参与贡献 Fork 本仓库 新建 Feat_xxx 分支 提交代码 新建 Pull Request>
VSc++编程助手1.0 - 1
Node.js,简称Node,是一个开源且跨平台的JavaScript运行时环境,它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立,旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎,可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型,这使得它非常适合处理大量并发连接,从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外,Node.js使用了模块化的架构,通过npm(Node package manager,Node包管理器),社区成员可以共享和复用代码,极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展,它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等,因此,开发者可以用JavaScript编写全栈应用程序,这一点大大提高了开发效率和便捷性。 在实践中,许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台,如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能,简化了开发流程,并且能更快地响应市场需求。
详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;详情请查看资源内容中使用说明;
本文主要论述了如何使用JAVA语言开发一个旅游资源网站 ,本系统将严格按照软件开发流程进行各个阶段的工作,采用B/S架构,面向对象编程思想进行项目开发。在引言中,作者将论述旅游资源网站的当前背景以及系统开发的目的,后续章节将严格按照软件开发流程,对系统进行各个阶段分析设计。 旅游资源网站的主要使用者分为管理员和用户,实现功能包括管理员:首页、个人中心、用户管理、景点信息管理、购票信息管理、酒店信息管理、客房类型管理、客房信息管理、客房预订管理、交流论坛、系统管理,用户:首页、个人中心、购票信息管理、客房预订管理、我的收藏管理,前台首页;首页、景点信息、酒店信息、客房信息、交流论坛、红色文化、个人中心、后台管理、客服等功能。由于本网站的功能模块设计比较全面,所以使得整个旅游资源网站信息管理的过程得以实现。 本系统的使用可以实现旅游资源网站管理的信息化,可以方便管理员进行更加方便快捷的管理,可以提高管理人员的工作效率。 关键词:旅游资源网站 JAVA语言;MYSQL数据库;SSM 框架
c#电脑端控制esp串口代码