交互设计中心-72色

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

li区块的整体点击css、jQuery代码

2010年6月2日 | 分类:jquery/javascript | 评论:0 | | Tags:li  点击  区块点击  

 

有的时候会想让li列表,或者文章带有标题和简短简介的列表整体加上一个连接直接连接到具体文章,这样有两种方法,

一种是用纯css来制作:

<a href="">

...


jQuery写的漂亮的图片浏览lightbox插件

2010年5月26日 | 分类:jquery/javascript | 评论:1 | | Tags:jQuery  lightbox  漂亮  

 

这是一个老外写的一个用jQuery写的图片浏览插件,鼠标放上去其余图片变黑,点击图片,图片放大,再点击就缩回原来的样子,很实用还很炫,

点击预览一下

...


jquery禁止页面右键的代码

2010年5月19日 | 分类:jquery/javascript | 评论:0 | | Tags:jQuery  禁止右键  

jquery实现你的网站不能右键,很简短的代码:

$('body').bind('contextmenu', function() {
      return false;
    });

简单把。

注:bind事件处理功能为:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数。

...


文本框input聚焦失焦样式

2010年4月25日 | 分类:jquery/javascript | 评论:0 | | Tags:input  聚焦  失焦  

大家都知道浏览器里面的文本框的聚焦(focus)时可以改变样式,可以变得更漂亮,让用户体验会更好,今天72色来给大家看看这个样式怎么去改变。


首先用css的伪类:focus可以改变。
文本框的html代码假设如下:
<dl>
  <dt>Name: <dt>
  <dd><input type="text" /></dd>

...


漂亮的javascript对话框(弹出层)组件[附源码]

2010年4月16日 | 分类:jquery/javascript | 评论:1 | | Tags:弹出框  漂亮  

javascript对话框(弹出层)组件artDialog

  artDialog是一个轻巧且高度兼容的javascript对话框组件,可让你的网页交互拥有桌面软件般的用户体验。

  演示地址:http://www.planeart.cn/downs/artDialog/

  项目主页:http://code.google.com/p/artdialog/

  artDialog2采用全新的UI


推荐5个漂亮的jquery主流图表插件

2010年4月6日 | 分类:jquery/javascript | 评论:0 | | Tags:jQuery  图表  插件  漂亮  

5个jQuery图表(生成)插件评测

...


带动画的GIF图片在IE中不能正常工作

2010年3月16日 | 分类:jquery/javascript | 评论:0 | | Tags:GIF  IE  动画  

这个问题,怎么说呢,先把症状重复一遍吧:IE显示了图片,但是动画却不能播放。而在FirFox中却能正常的工作。
一直以来,我都以为是浏览器的关系。没有设定好而导致这种情况发生,比如一些在IE核心上开发的浏览器(maxthon)等,都可以把GIF动画关闭的。所以我也就没有仔细研究过。

来看看这个:
IE和FirFox在很多地方都有着或多或少的不同,这导致在开发时需要考虑很多的特殊情况。在最近的项目中居然发现带动画的GIF图片在页面Load之 后再以脚本控制的方式展现时,动画不能表现出来。在我的项目中,需要在点击一个按钮后来显示一个动态的Loading图片以此表示程序正在进行后台处理。 这是通过一段jQuery代码来实现的:
...


2009年度最佳jQuery插件整理

2010年3月9日 | 分类:jquery/javascript | 评论:0 | | Tags:jQuery  插件  最佳  

jQuery 是个宝库,而 jQuery 的插件体系是个取之不竭的宝库,众多开发者在 jQuery 框架下,设计了数不清的插件,jQuery 的特长是网页效果,因此,它的插件库也多与 UI 有关。本文是 webdesignledger.com 网站推选的2009年度最佳 jQuery 插件。

拉洋片

在一个固定区域,循环显示几段内容,这种方式很像旧时的拉洋片,2009年,这种 Web 效果大行其道,jQuery 有大量与此有关的插件,以下插件无疑是最佳的。

...


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 ]})
...


收藏本页功能的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"

...