2011年04月23日 by 张 鑫旭 阅读 85583 次, 今日 4 次
不好意思,与上篇类似,也是CSS3下的一些技术或者说是效果实现的展示。本文的内容是使用CSS代码创建各种条纹效果。一如既往,有demo,有必要的截图,有源代码展示,同时本文还要相对比较详细的讲解。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: background-size, css3, gradient, photoshop, rgba, transparent, 渐变
发布在 CSS相关 | 6 条评论 »
2011年04月20日 by 张 鑫旭 阅读 137128 次, 今日 5 次
本文内容不多,就是介绍了两种实现文字渐变的效果,都需要依赖一些CSS3的属性。同样的,每个方法提供相应的demo页面,提供相应的效果截图以及必要的源代码展示。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: chrome, content, css3, Safari, webkit, 文字渐变, 渐变, 颜色
发布在 CSS相关 | 7 条评论 »
2011年04月18日 by 张 鑫旭 阅读 70651 次, 今日 1 次
由于jQuery自身没有wheel事件滚轮事件,懒得折腾,所以这里只写了MooTools库下是简易自定义滚动条。此自定义滚动效果比较简单,就点击滚动条拖移和鼠标滚轮滚动两个效果。
本文提供必要的demo页面以及源代码下载,另外简单展示了该小插件的使用,并分析了其一些不足和适用情况,内容相对较少。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: jQuery, MooTools, 插件, 滚动条, 相对定位, 绝对定位, 自定义滚动条
发布在 JS实例 | 7 条评论 »
2011年04月14日 by 张 鑫旭 阅读 296640 次, 今日 164 次

本文的内容基本上是基于“区域范围对象(Range objects)”这个概念来说的。这个玩意,可以让你选择HTML文档的任意部分,并可以拿这些选择的信息做你想做的事情。其中,最常见的Range是用户用鼠标选择的内容(user selection)。
本文有不少篇幅就是讲如何将用户的这种选择转换为W3C Range或Microsoft Text Range对象。随后展示了Range相关的JavaScript库,以及JS 文本域光标处插入文字的实现——即新浪微博的插入话题功能的完整版实例展示。
本文提供必要的表格数据,源代码展示,效果截图以及demo页面,内容较多,篇幅较长。希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: createTextRange, plugin, range, selection, setSelectionRange, 兼容性, 插入文字, 文字选中, 新浪微博
发布在 Web综合 | 20 条评论 »
2011年04月8日 by 张 鑫旭 阅读 59528 次, 今日 2 次
国外就页面可用性方面的讨论是很多也是很深的,貌似关注longdesc属性的前端相关人员还是很多的,相关的讨论也较多。相比国内,就淡得多。其实自己之前对该属性也是七窍只通六窍——一窍不通。所以,不想班门弄斧,本文就简单介绍下longdesc属性相关的一些内容,一些深入的可用性方面的东西自己确实业余的很,就不提及了。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: HTML5, longdesc, opera, 可用性, 图片, 搜索, 链接
发布在 HTML相关 | 7 条评论 »
2011年04月7日 by 张 鑫旭 阅读 111477 次, 今日 4 次
在web页面中,如果页面较高,为了方便用户快速地返回顶部,都会添加一个返回顶部按钮。本文就将简单展示下这种效果,本文的效果参照新浪微博的返回顶部效果,展示了在jQuery库和MooTools库下的实现。本文提供必要的demo页面和源代码展示。希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: jQuery, MooTools, 动画效果, 滚动条, 返回顶部, 锚点
发布在 JS实例 | 24 条评论 »
2011年04月2日 by 张 鑫旭 阅读 267441 次, 今日 12 次

CSS中有一个属性叫做clip,为修剪,剪裁之意。配合其属性关键字rect可以实现元素的矩形裁剪效果。此属性安安稳稳地存在于CSS2.1中,且使用上基本上没有类似于max-height/display:table-cell等浏览器的兼容性问题。但是,貌似大家很少使用此属性。实际上clip是实在在的可以在实际项目中大放光彩的东东。
本文一如既往,提供必要的demo页面以及源代码展示,提供属性的一些具有代表性的实例。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: clip, css sprites, css相关, IE6, png32, rect, 可用性, 图片剪裁, 旋转, 滤镜
发布在 CSS相关 | 35 条评论 »
2011年03月31日 by 张 鑫旭 阅读 287193 次, 今日 100 次
顾名思意,本文内容算是个小炒,备忘录。主要备忘HTML5的一些内容,从元素到事件,到浏览器支持等。非图片版和文字版,图片版方便收藏,文字版方便传播与即时浏览。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: audio, contenteditable, datalist, HTML5, ruby, video, 拖拽, 浏览器, 翻译, 键盘事件, 鼠标事件
发布在 HTML相关, 外文翻译 | 19 条评论 »
2011年03月20日 by 张 鑫旭 阅读 172375 次, 今日 3 次

本文是CSS 相对/绝对(relative/absolute)定位系列的第三篇,主要内容是absolute绝对定位的可用性隐藏,absolute绝对定位与等高布局,以及absolute相关的一些有趣的兼容性问题探讨。本文断断续续写了一个星期,所以行文上可能没有一气呵成之感;本周遇到些不顺心的事情,所以言语上也不如之前文章活波。但是,内容上并没有偷工减料,该有的截图还是有的,该有的demo还是有的,必要的代码展示也是有的。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: absolute, float, IE6, IE7, IE8, margin, relative, table-cell, visibility, 兼容性, 显示, 等高布局
发布在 CSS相关 | 22 条评论 »
2011年03月13日 by 张 鑫旭 阅读 306982 次, 今日 17 次

本文可以说是本月的重磅文章之一,讲的是如何利用text-align:justify在display:inline-block列表布局基础上实现列表元素的两端对齐布局,分门别类,由浅入深,逐层深入,并有一些总结性的注意事项。一如既往,本文不仅提供丰富的截图示意,提供必要的源代码展示,及时雨般的demo页面,更上一层楼,还提供总结性的表格数据。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签: display:inline-block, inline, inline-block, text-align:justify, 两端对齐, 列表, 布局
发布在 CSS相关 | 76 条评论 »