实验室
声明:以下demo并非完全原创,不代表个人技术,仅闲暇空余玩玩而已,仅此而已~!^_^!
Html
-
HTML 5 Forms Demo
输入框自动获取焦点、文本框的输入提示、强大的表单验证功能、有趣的input type=”range”、input type=”number”、输入框下拉提示、还有默认的日期选择。
-
纯css3实现酷炫网站图标
所有的例子使用简单、语义的HTML。无空元素,无不必要的额外的元素,无JavaScript,无图像。请使用支持css3的浏览器查看,Opear10目前还不支持背景渐变。
-
宽度自适应的input和textarea
这两个表单元素十分常用,由于其在各浏览器下表现略有不同,我们很难把握好宽度的设置,更别说宽度自适应100%啦。利用hack解决问题比较的不心安,通过下面方法可以很好的实现且跨浏览器兼容。
-
css Shadow
css3的一些东西,配合一些IE only 的滤镜,实现的阴影效果。代码比较简单咧!
-
高度自适应的页面
有参考嗷嗷的部分,但是表现层(css)与其有比较大的差别,代码本身可能还存在一些问题,但还是能凑合着用,兼容性测试通过IE6、IE7、FF2、FF3(其他浏览器还有待测试,家里的电脑就装了这些)。目前没使用任何hack。
-
利用css实现多列等高
任意多列,列中可以有任意个容器。比较好用吧!与js实现的相比较,缺陷就是需要设定一个最大高度,万一超出。内容会被hidden。貌似没其他大的问题(小问题能容忍就该容忍,没有绝对的十全十美)。
-
固定右栏宽度, 左栏自适应宽度
这个东西很简单,光看题目就够了。如果直接使用,可能还需要再改进改进哦~!
-
中栏宽度固定且居中,两侧边栏宽度相等且自适应
中栏的宽度固定,两边栏自适应窗口宽度且相等。改变窗口大小或改变显示器分辨率可看到效果。代码很简单,稍转点弯就是了!
-
不规则形状导航
这样的导航看起来挺复杂,做起来其实挺简单,只是IE6要用到滤镜来确保PNG的透明。万恶的IE6啊!
-
跨浏览器实现inline-block
inline-block,要是个主流浏览器都能很好的支持他,确实是一个很好的东东,至少可以避免float所带来的麻烦。这里利用一些hack或私有属性来解决各浏览器的兼容问题。
JS
-
基于jQuery实现轮换的选项卡
想写个这样的东西很久了,恰巧项目中要用到,就下了点功夫。利用模拟鼠标事件来做轮换···
-
基于jQuery实现星级评分效果
仿照『口碑』的评星级效果做的一点小东西,测试下自己这段时间的学习成果···
-
美化“丑陋”的Select
这个小东东折磨了我足足一天。工作上要用到,原本也在网上用过类似代码,考虑到老代码的效率问题,只有自己再花点精力咯!blog文章里就说过,又一点仿tudou,但绝非复制品。