以图明志

JQuery

博客新加入“扫码阅读”功能

给文章生成二维码
今天看到一个用户发了个话题,“PC端的URL在移动端上打开要一个个敲好麻烦,有什么好的办法?”。确实现在已经是移动时代了,在移动设备上阅读慢慢会成为主流,网站如果没有便捷的方式让用户在移动设备阅读的话还真有点落伍,于是想想就做个“扫码阅读”的功能吧。其实很简单,就是将网址生成二维码就行了。无论用PHP生成,还是用JavaScript生成都是可以的,从代码改动来说,用JavaScript会更省事些。

CSS

使用CSS3线性渐变实现图片闪光划过效果

线性渐变linear-gradient
在百度音乐 http://music.baidu.com/ 看到这么一个图片效果,当鼠标移上去的时候,会有一道闪光在图片上划过,效果挺酷炫的。大体思想是,设计一个透明层i,skewx在X轴上做了负25度的变形,背景颜色用的是CSS3的线性渐变linear-gradient,然后hover的时候,设置0.5s的动画时间。

CSS

可以尝试用Google Font API来摆脱网页字体的单调

仅仅抛砖引玉
在网页设计里,字体的显示是个问题。最普遍用的是宋体,但是宋体在 Win 7 下的表现真的很难看。雅黑端庄一些,但是随着字体大小,感觉汉字的大小也会有区别。小站现在用的字体是是宋体 + Arial/Georgia,因为习惯了也没多在意,其实对于英文字体有其它更好的选择。

CSS

常见的浏览器Hack技巧总结

总结是为了更好地记忆
如果你经常需要做前端页面,那么你一定多多少少需要解决页面的浏览器兼容问题。而浏览器兼容问题大部分也集中在对IE系列的兼容。这里就总结一下对IE系列的CSS Hack,记录一下,方便以后查阅。浏览器对css的解析是从前到后的,并且采用最后一个样式声明。

CSS

活泼的CSS 3动态气泡按钮制作

完全CSS 3实现
这一次,我们正在创造一个有用的设置与对CSS3的多重背景和动画的力量动画按钮。通过此按钮包,您可以很容易地变成一个动画按钮,在您的网页上的任何链接只是指定一个类名。没有必要JavaScript。四色主题和三个大小也可通过分配额外的类名。

CSS

如何组织与管理CSS文件

方便管理、修改和多人合作
CSS的管理一直是个让人有点头疼的问题,没有绝对的对错,无非就是为了方便管理、修改和多人合作罢了;网上流行的CSS管理方式讲来讲去无非也就以下几种:对于单个页面那种非常简单的,其实也可以直接把所有的样式写在一个外部文件里就行,或者直接写在页面的头部里,没有必要去纠结繁琐的CSS文件管理。

CSS

最优的浮动清除方案之一推荐

W3标准不变,清除浮动不止
对于日新月异的WEB开发技术和浏览器更新频率来说,清除浮动已然是一个被人嚼碎了的话题。说是这些年过去了,有关float的地方,还依然少不了清除浮动的标签和css代码。W3C整天研究html5,就不能抽出点时间来把这种烦人的小细节修正一下吗?抱怨归抱怨,饭还得吃,钱还得挣,清除浮动就不能停止。

CSS

收藏一个很有爱的CSS背景设计

闲逛收获
有一次在网上闲逛,看到一个很有爱的CSS,地址:F::Archieve。这里扒下来,保存一下~效果可以看本页的演示,在右下角。图片如下,觉得好可以右键卷走。

CSS

IE 6最小最大宽度与高度的写法

CSS表达式的使用
最小最大宽度,最小最大高度,这是CSS很常见的一个要求。在现代浏览器中,一个 min-height,min-width 就可以解决问题,但是在IE系列,比如IE6则比较繁琐一点。下面总结一些IE 6下的最小最大宽度与高度的一些写法。

CSS

CSS让图片垂直居中的几种技巧

三种方法介绍
在网页设计过程中,有时候会希望图片垂直居中的情况。而且,需要垂直居中的图片的高度也不确定,这就会给页面的布局带来一定的挑战。下面总结了一下,曾经使用过的几种方法来使图片垂直居中,除了第一种方法只限于标准浏览器外,另外两种方法的兼容性还不错。

JavaScript

script标签属性用type还是language?

浏览器对它们识别程度不同
查阅一些资料,主要是浏览器支持问题。type 和 language 属性都可用来指定 script 标签中的脚本的类型。language 属性在 HTML 和 XHTML 标准中受到了非议,这两个标准提倡使用 type 属性。遗憾的是,这两个属性的值是不一样的。您可能偶尔会看见 language 的值为 VBScript(对 type 而言是 text/vbscript),表示包含的脚本代码是用 Microsoft 的 Visual Basic Script 编写的。

HTML

用HTML5 Canvas做一个画图板

一个简单的Canvas应用
功能很简单,原理其实和拖放是类似的,主要是三个事件:在canvas 上绑定mousedown 事件以标志绘画的开始(调用moveTo 移动画笔) 在document 上绑定mousemove 事件来处理绘画时的行为(调用lineTo 以及stroke 进行绘画) 在document 上绑定mouseup 事件以标志绘画的结束(解绑document 上的两个事件)

JQuery

JQuery选择器$()的工作原理浅析

选择器写成$('#id')的时候最快
每次申明一个jQuery对象的时候,返回的是jQuery.prototype.init对象,很多人就会不明白,init明明是jQuery.fn的方法啊,实际上这里不是方法,而是init的构造函数,因为js的prototype对象可以实现继承,加上js的对象只是引用不会是拷贝,new jQuery,new jQuery.fn和new jQuery.fn.init的子对象是一样的,只是有没有执行到init的不同。

JavaScript

如何写一个网页标题title的闪动提示

一个网页消息提示功能的实现
通过网页title来提示用户有新消息这个功能很常见,比如现在的微博,还有一些邮箱,这个功能都很常见。如何实现则个功能呢?思路是:通过ajax访问后台,若有新消息,则将网页的title替换为 提示信息 ,并与空格来回切换。例:【你有新消息】与【     】切换。提示内容弄是动态的,所以替换文字的空格数目也是算出的。这里用全角的空格。

HTML

用HTML5 canvas写一个时钟

图片指针用ctx的drawImage可以实现
HTML5足够强大实现很多功能,画一个时钟只是一个小玩意。图片指针用ctx的drawImage可以实现。至于兼容性问题,网上的解决方案已经很多了。这个东东是用来玩的,不是用来做应用的,学习下canvas API。

JavaScript

JavaScript获取网页关闭与取消关闭的事件

使用setTimeout延时10ms执行onunloadcancel
在做Web开发时,我们经常用到页面关闭事件onbeforeunload,可以给用户一个选择放弃关闭的机会,就比如这个博客编辑器。如果用户选择了离开,那么onunload事件自然会触发;但若用户选择了取消,又该如何检测呢?我们假定一个页面离开取消事件,叫做onunloadcancel。显然,这个事件应触发在用户按下对话框的取消按钮之后。
1 / 25 首页 < Prev 1 2 3 4 5 Next > 尾页 页码: