BeautyCssRss

Featured Posts

一款很好的解决IE6的PNG透明JS插件 DD_belatedPNG IE6的PNG透明是个老问题了,最近有朋友问我有没有最好的解决这个问题的插件。虽然知道且在用DD_belatedPNG这个插件,今天抽空把这个发上来。 虽然之前在博客里发过一款jquery的png插件,但是不支持背景平铺。 DD_belatedPNG使用了微软的VML语言对PNG图片进行重新绘制,以达到半透明的效果,并且能支持background-position和background-repeat属性,支持伪类。是一款不错的值得推荐的插件,用法也比较简单。 使用方法: ...

Read more

Jquery Fancybox使用技巧及心得整理 Fancybox是一款很绚丽的jquery弹出层展示插件。之前一直也在用,不过是用的官方demo里的那些基本展示效果。在最近的项目里,由于需要用到了不少fancybox的属性及其他技巧整理如下。至于fancybox的基本用法,我在这也不说,网上一搜很多的,也可以看官方demo。下面的几个例子中,我只列出对应的功能需要加的属性,其他基本属性我就不列出来了。 1.随滚动条滚动居中展示。 如果是常用及熟悉fancybox基本属性的朋友,应该了解这个属性,这也是为了更好的用户体验。 'centerOnScroll' :...

Read more

前端应该熟悉的10个CSS3属性 随着Css3和html5的风靡,越来越多的前端人员开始学习Css3,今天的文章就是来说说前端应该掌握10个Css3属性。对于Css3的新属性,你又了解多少呢?虽然大多数的css3属性在很多流行的浏览器中不支持,但是我们鼓励在前端开发中要学会并且运行这些css3属性,因为这是未来的趋势。关键是首先确定你是否对各个浏览器之间的细微的差别有所了解,你能肯定的说IE显示的90度的角就不圆滑嘛?这取决于你的决定。但是要永远记住,网站设计不必看到所有浏览器的不同。在文章的最后,我们将显示一个有趣的最终的案例。 1、border-radius ...

Read more

基于jQuery的网页Flash嵌入式插件 jQuery.Flash是基于jQuery插件的JavaScript代码,主要为了解决Flash在WEB页面的嵌入式解决方案,与AC_RunActiveContent、SWFOjbect功能类似,但是与其相比有更多的优点: (1) 完全符合W3C标准 WEB页面嵌入式Flash是通过JavaScript脚本生成的,针对不同浏览器生成完全符合W3C标准的Flash页面嵌入式代码。 (2)...

Read more

22个HTML5的初级技巧 Web技术的发展速度太快了,如果你不与时俱进,就会被淘汰。因此,为了应对即将到来的HTML5,本文总结了22个HTML5的初级技巧,希望能对你进一步学习好HTML5会有所帮助。 1. 新的Doctype声明 XHTML的声明太长了,我相信很少会有前端开发人员能手写出这个Doctype声明。 HTML5的Doctype声明很短,看到这个声明相信你马上就能记住,不用浪费脑细胞去记那长的有点变态的XHTML的Doctype声明了。 HTML5的简短的DOCTYPE声明是让Firefox、Chrome等现代浏览器和IE6/7/8等浏览器都进入(准)标准模式,你可能会奇怪IE6/7居然也可以支持HTML5...

Read more

一款很好的解决IE6的PNG透明JS插件 DD_belatedPNG

Category : CSS3

IE6的PNG透明是个老问题了,最近有朋友问我有没有最好的解决这个问题的插件。虽然知道且在用DD_belatedPNG这个插件,今天抽空把这个发上来。
虽然之前在博客里发过一款jquery的png插件,但是不支持背景平铺。
DD_belatedPNG使用了微软的VML语言对PNG图片进行重新绘制,以达到半透明的效果,并且能支持background-position和background-repeat属性,支持伪类。是一款不错的值得推荐的插件,用法也比较简单。

使用方法:

1
2
3
4
5
6
<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
  DD_belatedPNG.fix('.png_bg');
</script>
< ![endif]-->

Continue Reading

Jquery Fancybox使用技巧及心得整理

Category : jQuery

Fancybox是一款很绚丽的jquery弹出层展示插件。之前一直也在用,不过是用的官方demo里的那些基本展示效果。在最近的项目里,由于需要用到了不少fancybox的属性及其他技巧整理如下。至于fancybox的基本用法,我在这也不说,网上一搜很多的,也可以看官方demo。下面的几个例子中,我只列出对应的功能需要加的属性,其他基本属性我就不列出来了。

1.随滚动条滚动居中展示。
如果是常用及熟悉fancybox基本属性的朋友,应该了解这个属性,这也是为了更好的用户体验。

?View Code JAVASCRIPT
1
'centerOnScroll'	: true

Continue Reading

前端应该熟悉的10个CSS3属性

Category : CSS3

随着Css3和html5的风靡,越来越多的前端人员开始学习Css3,今天的文章就是来说说前端应该掌握10个Css3属性。对于Css3的新属性,你又了解多少呢?虽然大多数的css3属性在很多流行的浏览器中不支持,但是我们鼓励在前端开发中要学会并且运行这些css3属性,因为这是未来的趋势。关键是首先确定你是否对各个浏览器之间的细微的差别有所了解,你能肯定的说IE显示的90度的角就不圆滑嘛?这取决于你的决定。但是要永远记住,网站设计不必看到所有浏览器的不同。在文章的最后,我们将显示一个有趣的最终的案例。

1、border-radius

border-radius

border-radius

Continue Reading

基于jQuery的网页Flash嵌入式插件

Category : jQuery

jQuery.Flash是基于jQuery插件的JavaScript代码,主要为了解决Flash在WEB页面的嵌入式解决方案,与AC_RunActiveContent、SWFOjbect功能类似,但是与其相比有更多的优点:

(1) 完全符合W3C标准
WEB页面嵌入式Flash是通过JavaScript脚本生成的,针对不同浏览器生成完全符合W3C标准的Flash页面嵌入式代码。

(2) 稳定的交互功能
在JavaScript与Flash或Flash与JavaScript交互调用的WEB页面,SWFOjbect与AC_RunActiveContent表现不够良好,由于JavaScript或Flash加载顺序问题,经常导致无法交互调用,jQuery.Flash可以完成支持JavaScript与Flash双方的互相交互。
Continue Reading

22个HTML5的初级技巧

Category : HTML5

Web技术的发展速度太快了,如果你不与时俱进,就会被淘汰。因此,为了应对即将到来的HTML5,本文总结了22个HTML5的初级技巧,希望能对你进一步学习好HTML5会有所帮助。

1. 新的Doctype声明

XHTML的声明太长了,我相信很少会有前端开发人员能手写出这个Doctype声明。

Continue Reading

CSS3开发工具收集

Category : CSS3

英文原文:List of Really Useful Tools For CSS3 Developers
中文原文:CSS3开发工具收集

通常来说,CSS非常简单。但是当浏览器厂商开始实现CSS3特性,问题开始变得有些复杂了。不难,只是有些复杂。这可能包括两个方面:首先有些心得CSS3属性(比如,transition、渐变、transform等)不是那么简单,其次我们不得不使用浏览器厂商指定扩展。

CSS3开发工具收集

直到你最喜欢用的IDE原生支持CSS3,你最好的伙伴将是CSS3生成器、手册、参考指南以及基于JS的方案。这正是本文要推荐的,这里将收集能够助你学习和使用CSS3的真正有用的工具。

Continue Reading

IE6不支持的十个实用的CSS属性

Category : CSS技巧

ie6

IE6对一些非常有用的css属性完全不支持。比如min-width,无人不抱怨IE6的css兼容性问题。本文介绍了10个很实用但IE6却不支持的CSS属性,列出这些属性并不是为了数落IE(数落也没用), 而是你了解了哪些CSS属性是IE6不支持的,就更有针对性的去编写CSS和Hack了。

一、Outline
在调试CSS问题的时候,我常常在指定元素上添加border来精确的查看该元素会发生什么并帮助确定问题的来源。这常常是有效的,因为它可以在布 局上给我更加具体的可视性。但是如果是块级元素,这可能会发生某些错误——在任何块级元素上添加1px的边框很可能会影响到布局,它会让这个元素的宽度额 外增加2px。
outline 属性是完美的替代者,因为它可以在不影响文档流的情况下呈现该对象。但是IE6 和IE7 不支持 outline 属性,所以,它不能在这两个浏览器中用于调试。

Continue Reading

20多个漂亮的使用jQuery交互的网站

Category : jQuery, 设计欣赏

jQuery是使用最多的JS库之一,它有很多优点,比如轻量、易用、完善的Ajax、良好的浏览器兼容,以及它有健壮的选择器等。这些优点使得jQuery成为帮助前端开发人员的有力工具。越来越多的大型网站开始使用jQuery及其插件实现其前端交互。

翻页、滑动、lightbox – serialcut.com

serialcut.com

Continue Reading

10个最佳的jQuery Lightbox效果插件

Category : jQuery

大家都很喜欢Lightbox弹框效果,这种效果在很多地方都很有用。而原始的Lightbox脚本已经被无数次的克隆到了所有的流行Javascript库中。本文特别收集了10个最佳的Lightbox效果插件,不定什么时候你就用到了……

jQuery Lightbox Plugin

Download Lightbox script

Continue Reading

15款漂亮的JQuery幻灯片插件

Category : jQuery

幻灯(通常也被称为“内容滑动”、内容切换效果、焦点图等)是在网站或博客的较小区域展示大量内容的很好的方法。动态的自动滑动内容在很多网站上都是很流行的。你是否也对在自己的网站上实现类似的效果感兴趣?那就看一下本文列出的jQuery插件吧!

 

1. jFlow

官方网站 | 演示

一个漂亮而整洁的图片幻灯,被nettut推荐,如果你想自己做一个图片幻灯效果,就去看看吧。

jFlow

Continue Reading