javascript模拟select实现代码

最近迷茫于javascript的闭包与继承,写一个小东西找找感觉。

JS+CSS模拟Select下拉框,选择表单效果

网页中使用Select语法实现的下拉框是很普遍的,但是您有没有见过使用JS+CSS模拟的Select下拉框?并且可以选择表单哦,尽管代码复杂了点,但是对于我们了解此类特效非常有帮助。


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]


这个作品在没有任何需求下完成,不保证能应用于实际应用,仅用于自娱自乐。

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]


用js模拟实现表单select选择的功能


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]


在不改变HTML结构的前提下,可更改其它样式。建议用IE8与FF浏览,可与默认样式进行对比。

发布一来是为了记录自己学习过程,二来想请朋友指点一下迷津,哪些地方欠妥或

本页内容版权归属为原作者,如有侵犯您的权益,请通知我们删除。

Javascript倒计时代码 - 2015-04-24 11:04:25

JS脚本: 复制代码 代码如下: script language="javascript" type="text/javascript" var interval = 1000; function ShowCountDown(year, month, day, divname) { var now = new Date(); var endDate = new Date(year, month - 1, day, 14, 07); var leftTime = endDate.getTime() - now
装饰者模式说明 说明:通一个类来动态的对另一个类的功能对象进行前或后的修饰,给它辅加一些额外的功能; 这是对一个类对象功能的装饰,装饰的类跟被装饰的类,要求拥有相同的访问接口方法(功能),这在动态面向对象类里,一般以实现同一个接口(interface)来约束实现;装饰类的要有对被装饰类的引用,用于在装饰类的相应方法,调用相应被装饰类的方法,然后对其进行修饰; 场景举例: 1. 比如我们生活中的穿衣服, 一件衬衣,一件西装外套,一条裤子,一条领带,一双漂亮的皮鞋; 每多穿一件,都是对前面一件或全身的装饰;
对于我们做WEB开发的,对表单的验证是必不可少的,所以今天把常用的一些验证罗列出来,呵呵,今天下午刚学的JS正则表达式,有什么不足的地方还希望大家批评指正。 一.相关的代码 复制代码 代码如下: function test() { var temp = document.getElementById("text1"); //对电子邮件的验证 var myreg = /^([a-zA-Z0-9]+[_|/_|/.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|/_|/.]?)*[a-zA-

JQuery基础语法小结 - 2015-04-24 11:04:24

1、$(document)将document对象转换为jquery 复制代码 代码如下: $(document).ready(function(){ alert("hello world"); }); 2、获取所有的超链接对象,并且增加onclick事件; 其实在底层jquery对象获得的每个标签的数组,因此我们不需要进行循环了 复制代码 代码如下: $(document).ready(function(){ $("a").click(function(){ alert("hello world"); }
最近项目中做了一个jquery.validate气泡提示。 好像最新版的jquery.validate中,有这个功能,但在我这里不怎么好用。 就自己加了一个。 找了一些插件qtip2的样式不错,但我本地显示不出来呀。他本身也有jquery.validate的例子。但样式在我这里不显示呀。好像是jquery版本的问他,用他的jquery就可以显示。用我的就不行坑爹。放弃。 poshytip-1.1这个,样式还不错! positionX,positionY是提示显示的位置。 复制代码 代码如下: $(docum
1. Hammer.js Hammer.js是被广泛使用的轻量级JavaScript框架,它提供了常用触摸操作的规范,比如收缩、拖放、双击和删除等等。它支持大多数移动平台像iOS,Windows Mobile, Android 和 BlackBerry。 2. jQuery UI jQuery UI非常适合那些用jQuery JS 库开发App的用户。提到jQuery UI,就不得不提到跟它非常相似的Kendo UI。Kendo UI可帮助创建原生的移动和桌面应用,对性能和易用性方面都做了大量优化,相较起

js 封装cookie操作的函数代码 - 2015-04-24 11:04:22

核心代码: 复制代码 代码如下: var cookie={ setCookie:function (name, value, iDay) { var oDate = new Date(); oDate.setDate(oDate.getDate()+iDay); document.cookie = name+'='+value+';expires='+oDate; }, getCookie:function (name) { var arr = document.cookie.split('; '); f
我一直对视频和图片中的人脸标记、检测和人脸识别技术很感兴趣。尽管我知道获取逻辑和算法去开发人脸识别软件或者插件已经超出了我的想象。当我知道Javascript库可以识别微笑,眼睛和脸部结构时,我得到启发去写一个教程。有许多的库,这些库要不就是纯粹的基于Javascript的,要不就是基于java语言的。 今天,我们开始学习tracking.js,它是一个由Eduardo Lundgren开发的轻量级的javascript库,它可以让你做实时的人脸检测,色彩追踪和标记好友的脸。在这个教程中,我们将会看到,我

jQuery中jqGrid分页实现代码 - 2015-04-24 11:04:21

(1)页面代码: 复制代码 代码如下: !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd" html head meta http-equiv="Content-Type" content="text/html; charset=UTF-8" titleInsert title here/title link rel="stylesheet" type="te
解决办法: 打开jquery.fancybox-1.3.4.css 注释掉这行就行了: 复制代码 代码如下: .fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_close.png', sizingMethod='scale'); }