Hiro's Blog

添加弹框Ajax加载catgory、tag的最新10篇文章!

CSS:CSS3基础(附图)

分类:前端工程 发表时间:2010-03-08 10:41

今日在Web Designer Wall博客上看到这篇介绍css3基础的博文,文章其实很普通,关键喜欢他配上了截图,看起来就更加明了。便花了点时间整理后发表出来与大家分享一下!

文中主要介绍了四个css3高级属性,也是最最常用的四个css3属性。

最后,css3高级属性远远不值文中的这些,文中讲到的是一些基础的,也是使用最多的,为了给用户带去更多的美好体验,努力学透css吧!

本文翻译自:Web Designer Wall — The Basics of CSS3

jQuery:1.4新版本中你应该知道的15个新特性(二)

分类:前端工程 发表时间:2010-01-22 13:04

继续发布jQuery1.4版本剩余的新特性:第9点至第15点。

九、去除标签元素的父标签;

十、不用删除数据,即可删除掉DOM中的标签元素;

十一、对.index()方法进行了扩展;

十二、DOM控制方法支持回调函数…

jQuery:1.4新版本中你应该知道的15个新特性(一)

分类:前端工程 发表时间:2010-01-20 13:53

题外话:前两天回了一趟泰州,星期二上班后看到了两条比较重大的新闻:1.谷歌耍了我们这些谷歌迷们一把,决定不离开中国了;2.jQuery1.4新版本也正式上线了。

Nettuts+博客上看到了这票jQuery1.4新特性的总结性文章,该博总结了15条新的特性,便给出相应的实现代码。觉得不错,便整理后翻译过来供大家参考,并加入了1.32版本的实现方法进行比较性地学习。

文章较长,分两篇文章发布,请关心者耐心阅读与等待!上篇包含特性1-8点,下篇9-15点隔一日再发布!

Javascript:10个Javscript编程的技巧

分类:前端工程 发表时间:2009-12-18 17:45

javascript-tips

今天在Blog:Impressive Webs上看到这篇总结了10个Javascript技巧的文章。觉得比较受用,便简约地理解后翻译了给需要的朋友学习学习。

文章中的10条小技巧或许对大家来说已经是了然于胸了,但有时候编程晕头晕脑的,不经意间就会忘记。所以在平时的编程过程中养成一个良好的编程习惯是一个程序员最基础的素质要求。只要多练、多看、多学习,我们的编程技术就会越来越高明的!

该文整理来自:Impressive Webs:10 JavaScript Quick Tips and Best Practices

jQuery:通过事件委派一次绑定多种事件,以减少事件冗余

分类:前端工程 发表时间:2009-12-16 11:42

tooltips-logo

jQuery的最大特色之一就是方法连缀写法,这样的书写方式使得阅读起来更加方便。于是乎,在日常的开发中大量使用连缀写法,而事件方法连缀就是一个特例。若给一个Dom对象使用了绑定了多个事件,便于阅读和书写,习惯了使用连缀写法,但这样的书写方式会造成时间的冗余。

1.事件冗余:多个事件方法中多次调用相同的代码

2.事件委派:一次性绑定多个事件,根据事件类别委派相应的操作

jQuery:如何在页面和插件代码中自定义别名

分类:前端工程 发表时间:2009-12-01 22:03

jquery-plugins

众所周知,jQuery是采用$符号作为库的别名,但若是和其他类型的库一直使用是,其他库也有用$符号作为别名的,这样就会引起函数的冲突。所以更多的时间是建议大家使用jQuery来做为别名,或者自定义别名。该片文章重点地讲述了如何在页面代码和插件代码中自定义别名,以便于其他库的兼容,为之后的插件开发之旅铺垫道路!

1.在页面使用代码中如何自定义别名;

2.在插件代码中如何自定义别名。

HTML:编写干净的且富有语义的html代码

分类:前端工程 发表时间:2009-11-30 11:44

cleaner-coding

如果你是一个使用div标签做任何事的家伙,那么这篇文章将对你十分有益。该问重点讲述了如何通过使用富有语义的标签和最少的div标记来编写干净的html代码。你是否曾经也试图去修改别人的一些html模板,那么你一定会被代码里那些肮脏的标签所抓狂。编写干净的html代码,不仅对你自己有益,而且对你的团队也有益。他将大大地节约了你的开发与错误调试时间(特别是比较大的一些项目)。

1.尽可能少地使用div标签;
2.使用div标签来控制页面的整体布局,如头部,内容部,侧边栏,底部等;
3.内容必须包含在对应的语义标签内,而不是包含在div内;
4.格式化你的源代码并且在结束标签处给出对应的注释语言。

该文翻译自:WebDesignWall: Coding Clean and Semantic Templates

jQuery:增强型走马灯公告栏,可以抛弃marquee标签了

分类:前端工程 发表时间:2009-11-26 23:30

noticeBox-thum

昨天晚上收到的求助邮件,说因上级的要求需要制作一个走马灯效果的公告栏,希望我可以帮助他解决。因看到邮件的时候都快要睡觉了,所以并没有立即处理。

今天早上到了公司,放开手边的工作,花了一点点时间给他制作了一个主流浏览器都兼容的走马灯公告栏。然后mail给他,但他过会儿回邮件说缺少鼠标悬停时停止的效果。于是乎有花了几分钟添加了相应的代码。到了下午快下班的时候,该同学又发来了邮件,说我的公告栏的效果有点欠缺,现在的效果和marquee标签的效果一样,需要等内容上移完成后才会重复滚动,如果可以连续滚动的话那就完美了。

于是就在刚刚的时间我有花了几分钟的时间给他解决了,mail给他。不知道他是否还会有什么新的要求呢,期待啊!毕竟这对我来说也是一个挑战嘛,同时也帮助到了别人,何乐而不为呢!

Ajax:当前页面更改内容,前端实现

分类:前端工程 发表时间:2009-09-23 12:26

Ajax-Editing

相信大家有用过Google Doc或Flickr,或者一些SNS社区的图片添加描述信息的效果,他们是在点击了一段文字后出现一个输入框,在输入框内输入你要填写的内容,点击“确认”或者“发表”即可立即显示出来。

今天做的这个效果呢,就是其中的截取版本。为什么这么说呢,因为我的效果只实现了前端的更改后立即发布的效果,而没有实际的与服务器端交互,也没有将输入的内容添加到数据库中,主要是为大家介绍一下实现原理。

注意:源代码中没有jQuery库文件,请下载查看代码的朋友根据源代码路径自行添加。

jQuery:两个样式下拉菜单(click hover)

分类:前端工程 发表时间:2009-08-06 14:51

dropdownmenu

一直都很喜欢下拉菜单,因为这样可以导航到更多的页面,给访问者一目了然的感觉。

之前在公司的网站上就是用的下拉菜单导航栏的方式进行导航,当时是使用了li:hover的方式通过鼠标移动到li上,显示出li下的ul。而在ie6中则使用javascript修复li:hover。这样做出来是没有动态的效果,下拉菜单一下子就凭空出现了。

运用jQuery库制作下拉菜单的好处就是可以做出各种不同的动态效果,我今天讲解的是运用slideDown()和slideUp()函数实现的卷页效果。