一起CSS

当前位置:一起CSS

jQuery插件Cloud Zoom

日期:2010-06-11 分类:未分类

图片放大镜效果是一种不错的效果,多应用于电子商务、图片展示等网站,给用户带来更好的体验。实现这种效果的代码不少,今天要给大家介绍的是 Cloud Zoom,它是 jQuery 的一个插件。和其他产品相比,Cloud Zoom 具有代码少、功能多、兼容性好等特点,并且支持 Tint、 Soft Focus 和 Inner 三种放大镜模式。

cloud-zoom 演示图片

目前,Cloud Zoom 的最新版本是 1.0.2,我们就此版本为例(1.0.2与之前版本有所不同),来看看 Cloud Zoom 是如何工作的。首先,当然是引入插件以及附带的 CSS 文件,当然,你喜欢的话,样式可以自己编写。然后编写 XHTML 代码:

阅读全文 >

查看:1,788 评论:2 标签:,

Mozilla Firefox 4.0最新用户界面

日期:2010-06-6 分类:浏览器

Mozilla Firefox 4.0 很让人期待,因为 Firefox 4.0 在性能、安全和用户界面上都有很大的改进。虽然用户界面的设计有抄 opera 的嫌疑,但这种设计我个人认为是不错的——简洁、大方。半透明的玻璃化效果让人看起来很舒服,而且压缩了菜单栏、搜藏栏等等,让浏览界面更宽敞。随便说一下,不仅 Firefox 采用了这种设计,甚至所谓的 遨游3.0 、QQ浏览器也采用这种设计。看看具体的图片吧:

Windows:

Firefox 4.0最新用户界面图片1

Firefox 4.0最新用户界面图片2

阅读全文 >

查看:766 评论:7 标签:

“导”字导致样式失效

日期:2010-06-3 分类:CSS

编码是一个标准页面所必须的,但有些人不太在意。或者不定义编码,或者混用编码。也许一般情况下不会出问题,但出了问题就很难会注意到和编码有关系。

一位朋友就因为混用编码引发了一个奇怪的问题:样式文件内的部分样式失效,而代码没有任何错误。你没遇见过这样的问题吧?来看看具体是什么情况:

这位朋友的 HTML 文件的编码为 gb2312 ,而 CSS 文件是 utf-8 的,CSS 文件里有一条注释为“/*导航条*/”。这些有问题吗?对!也许他们不同时存在就没问题,但他们存在了就产生了一个奇怪的问题:注释“/*导航条*/”与下一条注释之间的样式在 IE 下没有效果,如果没有下一条注释了,则下面的样式全部没有效果。不光是 IE6 、IE7 ,甚至 IE8 、IE9预览版都没有效果。用 IE 浏览器测试下面的地址试试吧。

查看Demo

从测试页面可以看到有两条样式失效了,分别是:字体红色和下划线。奇怪的是把“导”字或“航”字删掉,样式就起效果了。更奇怪的是“导”字或“航”字他们的总数是基数的时候,如“/*导导航条*”或"/*导导导条*/",是偶数的时候又失效,如“/*导航导航条*/”或“/*导导航航条*/”。

避免问题的方法还有:

  1. 统一编码
  2. 注释用英文或拼音
  3. 注释结束和开头与注释间留空格,如“/* 导航条 */”

最好的办法是统一编码,因为编码不统一,也许还有其他潜在的问题。

如果我们认为这个问题是中文文字引起的,那可能还会有其他文字会引起这样的问题。不过我国的文字有几万个,我们不可能一个一个去试,这只是根据上面情况的一种推测。

查看:1,041 评论:5 标签:

说说CSS Hack和向后兼容

日期:2010-05-19 分类:CSS

人一旦习惯了某些东西就很难去改,以及各种各样的原因,新的浏览器越来越多,而老的总淘汰不了。增长总是快于消亡导致了浏览器兼容是成了谈不完的话题。说 到浏览器兼容,CSS HACK自然而然地被我们想起。今天,我们通常都有一个团队或者将有一个团队的人在一个公司里面做相同的事,需要我们有统一的规范来进行Coding,以 方便维护。而解决兼容的方法就是(必须是,因为这才最容易有问题的)其中一个最重要的、要解决的规范之一。

CSS Hack

在解决兼容方法上,想定出一个统一的规范,个人认为应该以下面3点为基本原则:

  1. 权衡成本:在浏览器被淘汰后,如何快速清理掉无用代码
  2. 可维护:在资源成本和完美间平衡的向后兼容
  3. 可读:省力、易记

这里把成本放在了第一位,并不是说我们不愿意追求完美,而只是,太刻意追求完美有时候可能会阻碍我们前进;在成本后,应该是可维护和可读,这点对于团队的合作来说至关重要,而最终结果也是为了减少成本。

先把这三个原则存起来,来看看我们平时解决兼容的写法(后面会附详细的Hack方法列表):

阅读全文 >

查看:444 评论:1 标签:

IE9平台预览第二版发布 支持HTML5 GPU加速

日期:2010-05-6 分类:浏览器

美国时间5月5日上午,IE 开发组发布了此前承诺的新版 Internet Explorer 9 平台预览版第二版。

IE9平台预览第二版界面图片

相较于第一次发布的技术预览版本,该版本具有众多的改进。重点改进性能、大屏幕显示器的支持、Web标准的兼容、开发工具也有很大提升、特别是实现了 HTML5 的 GPU 硬件加速。同时,微软也更新了 Test Drive 官网,用户可以通过下载 IE9 平台预览版2来测试和体验 IE9 浏览器的新变化。

由于 IE9 很多特性还未定型,“平台预览版”这个名称表明该版本仅(主要针对网页开发人员)展示新 IE 在速度、HTML5、CSS3、图形渲染等方面的改进,并没有包含完整的浏览器功能,也不能说明正式版的IE9就是什么样子。

下载:IE9 平台预览第二版

查看:471 评论:5 标签:

分类

最新日志

最新评论

存档

链接

  • 亚当学院
  • CSS视频教程下载
  • 前沿视频教室
  • 前端爱好者
  • GoodText
  • Kily`s Blog
  • mymickey
  • 秦丰网站策划
  • 奥想创意
  • 我的职业生涯
  • 蜗爱CSS
  • 蜈蚣's Blog
  • web标准学习—小辉博客
  • 十字花匠

© Copyright 2010 一起CSS All Rights Reserved