fcs
时下在互联网上很流行焦点区域轮播(焦点图)的形式，形式上就是以醒目的大图或配以说明性文字,进行定时交替播放。至于实现的技术手段就是FLASH或javascript的动态前台技术（基本没有什么技术含量可言）。不过从呈现方式上虽然精髓都是同一个，都是以同一区域展示的信息量成倍增加为最终目的，但是呈现效果、用户体验上可就是五花八门，百家争鸣，百花其放，丑态百出（这个好象不搭调）。
现面我们就拿几个最典型的实现方式来小论一下:
首先是在国内网站上比较流行的一种焦点图方式,所谓的新浪风格:
新浪的焦点轮播
这种轮播方式被国内大大小小网站拿来的拿来,演绎的演绎:
小熊在线的焦点轮播
太平洋电脑网的焦点轮播
要说明的是这种轮播图的方式目的已经达到,即上述的内容展示加倍。但是这种形式有两个缺点。第一，下面的当前播放的指示，不知设计人员是怎么考虑的，一个焦点图的位置能放几十还是几百张图片吗？最多超不过10张（通常3－5张），难道把用户当白痴数不清10以内或5以内的数？非要你标记一下那难看的系统字体的数字在下面？下面的指示器目的是说明共几张，当前第几张，小色块就足够了，加数字即影响美观又增加不必要的文件大小，简直是画蛇添足。第二，就是花里胡哨的过场效果，本来就不大的焦点区弄些乱七八糟的过场，用户刚看上去还比较新鲜，不出两三次就会烦，所以不要添加过场，这样就不会触犯任何审美倾向的用户。而且相当程度上减小了文件大小，带宽等开销，提升用户浏览的流畅性。
第二种是上述情况的改进型，个人认为是最好的轮播方式，简洁大方，好用易用：
news.yahoo.com
CCTV
这两个就是使用了小ICON做播放指示，简洁大方。CCTV的张数就有些多了，这时使用数字才比较合适，不过还可以接受。而YAHOO的那个只有三个，如果换成1.2.3，那真的就是把用户当白痴了，至少我还能数清楚是三张。
第三种很流行的是播放指示部分除了指示轮播张数、当前位置的作用外，还增加了内容缩略的作用：
CNET.COM
beijing2008.cn
上面这两个就是将内容缩略和播放指示和二唯一了，这使得用户即能知道当前播放的是那张，一共几张，还能看到每张的大概内容。其中beijing2008的那个增加了进度指示功能，可以让用户清楚自己看到下一张需要等多少时间。当然时间间隔指示有很多种，下面的就不错：
ESPN
这个时间间隔指示使用的是所谓的的2.0样式，一个环状加载指示。
总结：
轮播这种方式要么就用最简单的呈现，上述第二种，即能达到目的，又能给用户带来比较好的体验（这个有点大，通俗点，就是不招人烦）。要么就用第三种，让用户彻底清晰明了，知道自己在看什么，将要看到什么，多久能看到… … 。不伦不类的呈现方式还是尽量避免使用。
为你的链接添加站点缩略图
snap.com 提供了一项服务，通过增加一段代码实现在你的站点链接上弹出所链接地址的网页缩略图，如：http://www.snap.com/。
具体步骤：
一、进入注册页面
在左侧的注册框中有两个文本输入框：
Site URL:填入你要放置站点缩略功能的网站域名，比如 http://www.fscommand.com.cn/
Email:你的联系email
点击绿色“Go to step 2”按钮。
二、输入验证码获取代码
在Enter Security Token: 中输入下面的验证码
选中“ I agree to the Terms & Conditions below.”复选框
点击“Get Code”按钮
在右侧Step 3: Copy Your Code文本框中出现你站点专用的代码。将这段代码拷贝到你站点的页面的标签中。
IE6 中带有背景的链接闪烁
（本文翻译自ADOBE）
在IE6中带有背景的链接在鼠标浮上时背景图片会闪烁，这个问题可以用以下方式解决，前提是浏览器开启了Javascript功能：
目的是打开背景缓存。IE7已经修复此BUG。
介绍一下Adobe 的Spry Ajax Framework
Spry Ajax 开发框架是一个Javascript库，它能够为想要实现富应用的网页设计师及开发人员提供各种功能。
Spry是 为了那些需要Ajax，却没有其他框架可用或易用的网页设计团体而设计的。最初的Spry 框架是为了设计师能够使用HTML，CSS，和很少的Javascript实现将XML数据集成到他们的页面中，并不需要刷新页面。
Spry 框架是以HTML为中心，具有HTML，CSS，Javascript基础知识的用户就可以方便的部署。这个框架设计的方针就是标记尽量简单，Javascript使用尽量的少。任何做WEB设计开发的人都可以选择Spry 框架。
对于XML的数据加载和呈现是这个框架的强项，其核心的数据集概念使得数据调用非常方便。
目前的Spry Ajax还处于预览版本，并在不断改进之中。截止到写这篇BLOG的时候是pre-release 1.3版本。
Javascript cookie 详解
cookie概述
假如利用一个不变的框架来存储购物栏数据，而商品显示页面是不断变化的，尽管这样能达到一个模拟全局变量的功能，但并不严谨。例如在导航框架页面内右击，单击快捷菜单中的【刷新】命令，则所有的JavaScript变量都会丢失。因此，要实现严格的跨页面全局变量，这种方式是不行的，JavaScript中的另一个机制：cookie，则可以达到真正全局变量的要求。
cookie 是浏览器提供的一种机制，它将document对象的cookie属性提供给JavaScript。可以由JavaScript对其进行控制，而并不是 JavaScript本身的性质。cookie是存于用户硬盘的一个文件，这个文件通常对应于一个域名，当浏览器再次访问这个域名时，便使这个 cookie可用。因此，cookie可以跨越一个域名下的多个网页，但不能跨越多个域名使用。
不同的浏览器对cookie的实现也不一样，但其性质是相同的。例如在Windows 2000以及Windows xp中，cookie文件存储于documents and settings/userName/cookie/文件夹下。通常的命名格式为：[email protected]。
cookie机制将信息存储于用户硬盘，因此可以作为全局变量，这是它最大的一个优点。它可以用于以下几种场合。
1.保存用户登录状态。例如将用户id存储于一个cookie内，这样当用户下次访问该页面时就不需要重新登录了，现在很多论坛和社区都提供这样的功能。cookie还可以设置过期时间，当超过时间期限后，cookie就会自动消失。因此，系统往往可以提示用户保持登录状态的时间：常见选项有一个月、三个月、一年等。
2.跟踪用户行为。例如一个天气预报网站，能够根据用户选择的地区显示当地的天气情况。如果每次都需要选择所在地是烦琐的，当利用了cookie后就会显得很人性化了，系统能够记住上一次访问的地区，当下次再打开该页面时，它就会自动显示上次用户所在地区的天气情况。因为一切都是在后台完成，所以这样的页面就像为某个用户所定制的一样，使用起来非常方便。
3.定制页面。如果网站提供了换肤或更换布局的功能，那么可以使用cookie来记录用户的选项，例如：背景色、分辨率等。当用户下次访问时，仍然可以保存上一次访问的界面风格。
4.创建购物车。正如在前面的例子中使用cookie来记录用户需要购买的商品一样，在结账的时候可以统一提交。例如淘宝网就使用cookie记录了用户曾经浏览过的商品，方便随时进行比较。
当然，上述应用仅仅是cookie能完成的部分应用，还有更多的功能需要全局变量。cookie的缺点主要集中于安全性和隐私保护。主要包括以下几种：
1.cookie可能被禁用。当用户非常注重个人隐私保护时，他很可能禁用浏览器的cookie功能；
2.cookie是与浏览器相关的。这意味着即使访问的是同一个页面，不同浏览器之间所保存的cookie也是不能互相访问的；
3.cookie可能被删除。因为每个cookie都是硬盘上的一个文件，因此很有可能被用户删除；
4.cookie安全性不够高。所有的cookie都是以纯文本的形式记录于文件中，因此如果要保存用户名密码等信息时，最好事先经过加密处理。
设置cookie
每个cookie都是一个名/值对，可以把下面这样一个字符串赋值给document.cookie：
document.cookie=”userId=828″;
如果要一次存储多个名/值对，可以使用分号加空格（; ）隔开，例如：
document.cookie=”userId=828; userName=hulk”;
在cookie 的名或值中不能使用分号（;）、逗号（,）、等号（=）以及空格。在cookie的名中做到这点很容易，但要保存的值是不确定的。如何来存储这些值呢？方法是用escape()函数进行编码，它能将一些特殊符号使用十六进制表示，例如空格将会编码为“20%”，从而可以存储于cookie值中，而且使用此种方案还可以避免中文乱码的出现。例如：
document.cookie=”str=”+escape(”I love ajax”);
相当于：
document.cookie=”str=I%20love%20ajax”;
当使用escape()编码后，在取出值以后需要使用unescape()进行解码才能得到原来的cookie值，这在前面已经介绍过。
尽管document.cookie看上去就像一个属性，可以赋不同的值。但它和一般的属性不一样，改变它的赋值并不意味着丢失原来的值，例如连续执行下面两条语句：
document.cookie=”userId=828″;
document.cookie=”userName=hulk”;
这时浏览器将维护两个cookie，分别是userId和userName，因此给document.cookie赋值更像执行类似这样的语句：
document.addCookie(”userId=828″);
document.addCookie(”userName=hulk”);
事实上，浏览器就是按照这样的方式来设置cookie的，如果要改变一个cookie的值，只需重新赋值，例如：
document.cookie=”userId=929″;
这样就将名为userId的cookie值设置为了929。
获取cookie的值
下面介绍如何获取cookie的值。cookie的值可以由document.cookie直接获得：
var strCookie=document.cookie;
这将获得以分号隔开的多个名/值对所组成的字符串，这些名/值对包括了该域名下的所有cookie。
在实际开发中，cookie常常需要长期保存，例如保存用户登录的状态。这可以用下面的选项来实现：
document.cookie=”userId=828; expires=GMT_String”;
其中GMT_String是以GMT格式表示的时间字符串，这条语句就是将userId这个cookie设置为GMT_String表示的过期时间，超过这个时间，cookie将消失，不可访问。
删除cookie
为了删除一个cookie，可以将其过期时间设定为一个过去的时间．
指定可访问cookie的路径
默认情况下，如果在某个页面创建了一个cookie，那么该页面所在目录中的其他页面也可以访问该cookie。如果这个目录下还有子目录，则在子目录中也可以访问。例如在 www.xxxx.com/html/a.html 中所创建的cookie，可以被 www.xxxx.com/html/b.html 或 www.xxx.com/html/ some/c.html 所访问，但不能被 www.xxxx.com/d.html 访问。
为了控制cookie可以访问的目录，需要使用path参数设置cookie，语法如下：
document.cookie=”name=value; path=cookieDir”;
其中cookieDir表示可访问cookie的目录。例如：
document.cookie=”userId=320; path=/shop”;
就表示当前cookie仅能在shop目录下使用。
如果要使cookie在整个网站下可用，可以将cookie_dir指定为根目录，例如：
document.cookie=”userId=320; path=/”;
指定可访问cookie的主机名
和路径类似，主机名是指同一个域下的不同主机，例如：
www.google.com 和 gmail.google.com就是两个不同的主机名。默认情况下，一个主机中创建的cookie在另一个主机下是不能被访问的，但可以通过domain参数来实现对其的控制，其语法格式为：
document.cookie=”name=value; domain=cookieDomain”;
以google为例，要实现跨主机访问，可以写为：
document.cookie=”name=value;domain=.google.com”;
这样，所有google.com下的主机都可以访问该cookie。
综合示例：构造通用的cookie处理函数
cookie的处理过程比较复杂，并具有一定的相似性。因此可以定义几个函数来完成cookie的通用操作，从而实现代码的复用。下面列出了常用的cookie操作及其函数实现。
1．设置COOKIE
function SetCookie(name,value,expires,path,domain,secure)
{
var expDays = expires*24*60*60*1000;
var expDate = new Date();
expDate.setTime(expDate.getTime()+expDays);
var expString = ((expires==null) ? “” : (”;expires=”+expDate.toGMTString()))
var pathString = ((path==null) ? “” : (”;path=”+path))
var domainString = ((domain==null) ? “” : (”;domain=”+domain))
var secureString = ((secure==true) ? “;secure” : “” )
document.cookie = name + “=” + escape(value) + expString + pathString + domainString + secureString;
}
2．获取指定名称的cookie值：
function GetCookie(name)
{
var result = null;
var myCookie = document.cookie + “;”;
var searchName = name + “=”;
var startOfCookie = myCookie.indexOf(searchName);
var endOfCookie;
if (startOfCookie != -1)
{
startOfCookie += searchName.length;
endOfCookie = myCookie.indexOf(”;”,startOfCookie);
result = unescape(myCookie.substring(startOfCookie, endOfCookie));
}
return result;
}
3．删除指定名称的cookie：
function ClearCookie(name)
{
var ThreeDays=3*24*60*60*1000;
var expDate = new Date();
expDate.setTime(expDate.getTime()-ThreeDays);
document.cookie=name+”=;expires=”+expDate.toGMTString();
}
关闭窗口时触发事件（刷新时不触发onunload）
要在关闭窗口时触发一个事件，我们会想到window对象提供了两个事件：onUnload和onBerforUnload，因为它们是针对document的，当document被卸载或被卸载前触发。但这两个事件在刷新时也会触发，所以我们要采用什么方法来屏蔽除了关闭窗口操作以外而触发的onUnload和onBerforUnload事件从而执行里面的操作呢？代码如下：］
-
-
-
或
-
-
原理如下：
window.screenTop
获取浏览器客户区左上角相对于屏幕左上角的 y 坐标
screenTop>后面的数字必须大于你显示分辩率中的高度
比如，800*600, 这个数得大于600
window.screenLeft
获取浏览器客户区左上角相对于屏幕左上角的 x 坐标
screenLeft>后面的数字必须大于你显示分辩率中的宽度
比如，800*600, 这个数得大于800
通常这两个值设为9000
JS生成空IFRAME并修改内容
在页面放置空IFRAME，然后改变其文档HTML代码，可以实现代码不首父页STYLE控制，方便抓站使用。将抓来的代码放在一个JS变量中。注：要替换单引号，删除所有换行符。
代码如下：
-
-
-
-
</span></span> <span class="sc2"><span class="kw2"> -
-
-
-
-
-
body {
-
padding:0;
-
margin-top:4px;
-
background:#fff;
-
text-align:center;
-
color:#f00;
-
}
-
h1, h2, h3, h4, h5, h6, form, div, p, i, img, ul, li, ol, table, tr, td, fieldset, label, legend {
-
margin:0;
-
padding:0;
-
}
-
–>
-
-
-
-
-
在页面放置空IFRAME，然后改变其文档HTML代码，可以实现代码不首父页STYLE控制，方便抓站使用。将抓来的代码放在一个JS变量中。
-
-
-
// <![CDATA[ ‘);
-
var contenthtml = ‘在页面放置空IFRAME，然后改变其文档HTML代码，可以实现代码不首父页STYLE控制，方便抓站使用。将抓来的代码放在一个JS变量中。注：要替换单引号，删除所有换行符。 ‘;
-
function checkit1(){
-
if(contenthtml != ""){
-
fr1.document.body.innerHTML = contenthtml;
-
document.getElementById("fr1").height=fr1.document.body.scrollHeight;
-
}
-
}
-
//]]>
-
-
-