交互设计中心-72色

交互设计中心 | 用户体验 | 优化

jquery让数据列表活起来

2010年1月23日 | 分类:jquery/javascript | 评论:2 | | Tags:列表  表格  each  hover  

jquery 中" each"这个的用法很是省心,对于jquery返回的集合内容无需我们自己循环遍历并对每个对象分别做处理,jquery已经为我们提供的很方便的方法进行集合的处理。

72色在这里列出两种形式给大家:

$("p").each(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]})
...


File input 浏览上传按钮样式和文字的更改方法

2009年12月17日 | 分类:DIV+CSS | 评论:2 | | Tags:input  file  兼容  按钮  


上面这个图,大家一看就知道是上传所用的input,有没有想把“浏览”这两个字替换成别的呢,比如“上传”或者适合用它的地方的文字。有的时候把网站的别的but样式改了,唯独这个浏览but样子不变,甚是不美。
...


修改.htaccess做301重定向优化你的www网址

2009年12月15日 | 分类:用户体验/交互设计 | 评论:1 | | Tags:301  重定向  

经常会碰到这样的情况,其他网站链接你的站点时,会用下面的链接:

  • www.72color.com
  • 72color.com/
  • www.72color.com/index.html
  • 72color.com/index.php

而这样导致:你站点主域名的pr值分散到其他几个URLs了。

...


css制作目录菜单

2009年11月30日 | 分类:DIV+CSS | 评论:0 | | Tags:css  目录  菜单  


目录菜单的最终效果如上图,代码的大致布局如下图

其实大家看到这个图很清晰的就能知道他的css原理所在,下面是详细的thml及css代码
HTML

<ul>
  <li><strong>CSS Design</strong> <em>250<sup>95</sup></em></li>
</ul>
CSS代码
[CODE].menu {
...


竟然有人用某种手段偷走月亮

2009年11月25日 | 分类:漫无目的 | 评论:1 | | Tags:偷走  月亮  

有人利用现在的高科技(从地拔起的高高的云梯),还有可以伸缩的钩子,试图把我们的美丽的月亮偷走。。。

有图为证


众人期待IE9将通过硬件提速

2009年11月24日 | 分类:我的地盘 | 评论:1 | | Tags:IE9  IE  

微软IE产品经理透露,下一代浏览器IE9将通过GPU(图形处理器)渲染图片和文字,以提升浏览器的整体性能。不过,Mozilla和Opera等IE竞争者也在研究如何利用GPU加速浏览器。 微软IE浏览器团队总经理迪安-哈查莫维奇(Dean Hachamovitch)在接受采访时表示:“PC硬件具备巨大利用价值的原因之一就是GPU。因此,我们将在现代Windows图形引擎DirectX上开发IE。”

据悉,IE9将抛弃Windows系统的早期图像渲染引擎GDI(图形设备接口),继而使用Direct2D和DirectWrite APIs(应用程序接口)分别渲染二维图像和文字。

...


CSS两列,三列布局,自适应宽度

2009年11月24日 | 分类:DIV+CSS | 评论:0 | | Tags:css  布局  自适应  

[CODE=html]CSS两列布局,右侧固定,左侧自适应宽度

这是右侧的内容
这是左侧的内容,自适应宽度
...


柱状图也可以用纯css来写出来

2009年11月20日 | 分类:DIV+CSS | 评论:1 | | Tags:css  柱状图  

css写的柱状图

当大家看到这个柱状图的时候都想到用什么来实现了吗?
什么?不对用css也能实现,不可思意?out了吧,那就看看我们的国际友人怎么用纯css来写出来的。

点击预览一下

...


收藏本页功能的Javascript代码 兼容IE和Firefox的

2009年11月17日 | 分类:jquery/javascript | 评论:0 | | Tags:收藏  javascript  

< a href ="#"  onClick ="javascript:window.external.AddFavorite(document.URL,document.title);return false" rel="sidebar"> 收藏本页 </ a > 
取得当前页的URL: document.URL
取得当前页的title: document.title
实现在Firefox中“收藏本页”的关键所在: rel="sidebar"

...


翻转页面的设计

2009年11月13日 | 分类:用户体验/交互设计 | 评论:1 | | Tags:翻转  设计  

早期由于这种设计只有一种固定的模式,缺乏动态效果,另外冗余的样式对页面的加载速度也有不小的影响,其应用并不广泛。后来随着带宽的提升和web应用的多样化,这种表现手法被越多地方用到交互应用中,在形式上类似于开关的切换,而在功能上实现了两个tab页的跳转(只不过其中一个tab被弱化或隐藏起来)。它的交互缺陷为:只有用户点击了以后才知道页面下面隐藏的内容。...