豆瓣BLOG认领

注册豆瓣的时间是2005年12月9日,这个账号应该算是非常久远的一个账号,已经忘记了登录账号,多少年了。那个曾经2.0的概念都开始模糊了。从新开始玩豆瓣,不习惯,我甚至连那个我的BLOG都改不了,试着认领一下,然后才能删除,幸亏当年的那个域名还留着,要不,要不,要不,是不是就不能改了,留着那个再也不更新的地址,看着不舒服,重新把域名指向自己新的空间,然后输入一段验证码看看,是不是能有通过。据说通过以后就可以修改或者删除了,试试。

验证码: doubanclaime9a9f0b13db009b5

以上代码是认领的一段代码,开始验证,等待域名生效。

解决在IE下label中IMG图片无法选中radio的几个方法

今天遇到一个问题,在IE浏览器下,使用label FOR radio后,label中的图片无法选中。例如,这样的代码 <input type="radio" name="radio" id="a" /><label for="a"><img src="/Labs/images/logo.gif" /></label> ,这种情况下,点击label的图片将无法选中radio选项。解决这个问题,目前可以有三种方法,分别是通过JS、CSS或者HTML代码3个方面来解决。

方法一,JS:

window.onload = function(){
if(document.all && navigator.appVersion.indexOf("MSIE")>-1 && navigator.appVersion.indexOf("Windows")>-1)
{
var a = document.getElementsByTagName("label");
for(var i=0,j=a.length;i<j;i++){
if(a[i].hasChildNodes && a[i].childNodes.item(0).tagName == "IMG")
{
a[i].childNodes.item(0).forid = a[i].htmlFor;
a[i].childNodes.item(0).onclick = function(){
var e = document.getElementById(this.forid);
switch(e.type){
case "radio": e.checked|=1;break;
case "checkbox": e.checked=!e.checked;break;
case "text": case "password": case "textarea": e.focus(); break;
} } } } } }

方法二,CSS:

在图片上覆盖一个容器,容器本身透明显示

<input type="radio" name="radio" id="a" /><label for="a"><img src="xxx.jpg" /><span></span></label>

将其中SPAN的属性设定有底色并且透明,SPAN覆盖到IMG上,并保持和图片同样的尺寸。

display:block;
width:100px;
height:100px;
background:url(xxx.png) no-repeat 0 0;
position:absolute;
left:0;
top:0;

方法三,THML代码控制:

在IMG中加一个属性,disabled 即可。

三种方法都是可行的解决方案,从实用方面,当然是第三种方法最简单,操作和实施起来最快,兼容性也好。问题是,以上仅仅是这种情况下的解决方法,如果从经验方面,三种方法都有自己的优势。

淘宝商城改名天猫


淘宝商城改名天猫,总以为自从搜狗或者Google以后,互联网不在是动物世界,淘宝这次改名可谓惊天动地。从此又是一轮动物世界的SEO优化。天猫,现在搜狗输入法还没把这个词收录,输入默认还是天茂。至于为什么用这么个性感的猫代言人,咱们也不清楚。不过猫这个动物还是比较娇气的,和狗不一样。中国人讲求贱名好养活的习俗,天猫这个词显然不在这个范围内。天猫让我首先想到的是猫的天空之城,那个让人回忆的好地方。

换名的代价实在是,不可估计的大。淘宝商城在公交车广告、媒体等等投的那数亿元人民币,在换名以后,大大的打了一个折扣。当然,这不是淘宝商城乐意见到的情景,换名应该有个不得已的苦衷。或许是商标、或许是名字的标识,或许是为了和淘宝网撇清关系,最不可能是哪个人头脑发热,想改着好玩,今天又不是4月1号。2012到了,淘宝商城也换名字了。

还有就是我真的落伍了,至少在资讯方面,最近关注的频率几乎是以月来计算。不是萌萌同学提醒,俺现在还不知道淘宝商城换叫天猫了。火速,抢名进行中,什么地方抢到天猫的用户名,算你赢。O乐。

网址地址:http://www.tmall.com/

Google页面改版


Google页面设计本应该是以不变应万变的风格,一直以来都是小改改,最多也就是标志价格节日效果。只从有了Google+You以后,这个儿子可是被宠坏了,现在Google的脸是一月三变。忒频繁了点。Plus的区域从没有到有,到现在增加表现力度,在这个产品在不断被扩大的时候,我们发现国内的用户用Google用的越来越郁闷。搜索,你就搜索吧,选择你就选择把。突然搜个什么词,断了;点个什么按钮,死了。真是,改来改去,连那个基础都部分都没解决,还是把其他部门搞的这么醒目。真是长叹一声,诶~~

新的界面和上一版本的区别最大的地方就是将菜单的展示方式发生改变,黑色的顶部横栏变成了鼠标经过展示的侧栏。见图。反正就这样被,移来移去,越来越有苹果范。

2011.11.11 11:11:11

这个可能是我们有生之年看到最多1的一天,还有可能是11年以后,2022.22.22 22:22:22 那个二啊。不过杭州人民可能不太习惯这一天,还有11年,那是以后的事情。如果没有淘宝,今天也可能仅仅是网络上大家相互调侃几句,淘宝商城的造节行动让这个光棍节变的更加活跃,在商业活的驱动下,议论、话题还有促销活动等等,等等。看起来一片欣欣向荣的美好景象。

造节活动不是淘宝商城开始,不过在网络中,淘宝商城的光棍节造势确实是最成功的案例,第一年的光棍节让淘宝商城实实在在的热闹了一把。正是由于第一次太成功了,淘宝商城就陷进了这个看起来非常漂亮的套中。今年的光棍节,商家的支持力度比起往年显得底气不足,很多商品没几下就下架。用户兴致勃勃的来买东西,下单麻烦,而且总是看到涨价再打折的烂招。淘宝商城的还是没有像银泰这样有实体店的支持这样可以控制商家和商品,活动难啊。不过,这个活动不管怎么说,对买东西的人还是不错的,能买到便宜货,管他什么日子呢。

网站地址:http://www.tmall.com/

新浪微号值多少钱

新浪在2011年11月1日推出测试版本的微号服务,就是给微博设定了一个门牌的概念。这个服务结合了QQ号和微博地址,使用起来,至少目前来说还是有一点点方便的地方,不过也确实存在一些问题。比如在描述上,微号@微号直接获取信息,实际上是在输入框中@微号而提示用户名的一种便捷服务。微号目前提供各种档次的选择,金银铜,当然啦,金里面还有纯度区别的。新浪现在还是保留很多号码不开放,比如纯粹的数字基本没用到,仅有一个888888的数字是某个机构的代号。

微号到底值多少钱?对于微博来说,微币的推广需要一个特别的产品支持,毕竟现在的游戏不能给微博带来足够的利润空间;微号的推广能给新浪微博带来足够大的利润空间。如果按照QQ号的推广方式,大部分用户选择微号的话,那么那些付费微号将有比较高的广告价值,对于用户来说,短链接还是有足够的吸引力,对于那些没有获取自己喜欢的链接地址的用户来说,能够有一次重新选择的机会,还是不错的。而且微号选号的优势在于目前基本上还是非常的空余,能自选号码。

微号地址:http://hao.weibo.com

我的微号地址:http://weibo.com/770707

2011光棍节

节日的来源一般是纪念某个人或者某个事件的,而中国人的节日比起洋人来说,似乎更加有价值一点。比如,我们的节日总是能和自然规律相联系,而洋人仅仅是为了忘却的纪念而已。光棍节的由来,谁知道呢,反正就是一群网络上的青年在说啊说,于是就有了这么一个节日。而淘宝商城却在这个话题上成了最终收益者,商城第一个光棍节的甜头让淘宝商城一而再再而三的在这一天推波助澜,于是,大家也更加注意光棍这个词。

昨天是小光棍节,据说,11月1日和1月11日都是小光棍节,还有一个1月1日,那个传说中是元旦的日子也被牵连进来。下周五,几乎所有的焦点都在淘宝商城上,商家的巨大折扣,消费者喜欢;对商家来说,也正好是清尾货的最佳时机。反正不管怎么样,这只是一个理由,娱乐大众,娱乐一下自己。今年的光棍节,让给那些光棍们吧,我就不参合了,哈哈哈哈哈哈哈哈哈哈哈~~

GoogleReader变脸

自从有了Google+以后,Google的设计风格越来越走平的效果。以前,网页设计和软件设计有个沟通的趋向,就是凹凸有致。按钮是突出显示,输入框是凹陷显示,文字也是阴影,一条深色的线和一条浅色的线来表示层级。现在,网页设计越来越平,至少Google是这样,今天看到GoogleReader的时候就是深有感触。页面平成这样也行。基本上连分界线也消失了。虽然说用户能知道自己需要的东西在哪里,在这么多年的培养下,一下子没了分界线,感觉还是有差异,不能说好,也不是说不好。

设计有很多种趋向,其中就有用户跟着设计师走,或者设计师跟着用户走。最惨的就是设计师跟着BOSS走。最爽的就是设计师跟着感觉走。当然啦,很多情况下,我们需要做一个适合用户的产品,用户的需求分析是很重要的,怎么样培养用户,适应用户或者让用户适应产品,这个东西都是要靠产品本身的自信。创造标准很难,所以,我们很多时候都是在标准的阴影下做设计,不是说这个东西不好,有时候在标准的范围内,稍稍越界一下,设计效果可能更好,当然,也可能很糟糕。

网站地址:http://www.google.com/reader/

关于实名制那回事儿

最近的几天QQ农场总会弹出这样的提示:按照国家政策要求,QQ农场用户需要先进行实名注册。为了您顺畅的游戏体验,享受游戏生活,请您尽快进行实名注册。体重以后,提示立即注册或者关闭。想当然的,大部分人选择了关闭。在各种各样的实名制以后,网络渐渐失去了这层神秘的面纱,实名制的各种问题随之显示出来。隐私保护协议,这个曾经看起来没有什么作用的东西在实名制越来越普遍的情况下被推上台面。用户总是在问,是谁出卖了我的隐私;越来越多的推销电话,越来越频繁的数据丢失,以及并没有完善的隐私保护法律,在实名制的网络中,用户变成赤身裸体。

百度推出了个实名社区,在这之前实名还是遮遮掩掩的被人忽视。有这个巨大的平台做前锋,人们纵欲发现了实名这个实实在在摆在那里的东西。不过相对网站备案这么强硬的实名制,企业行为的实名往往比较缓和容易让人接受。在QQ农场,你可以说不,选择关闭按钮,不过网站备案被关闭的绝对是你的网站。一阵备案的风气之下,规范和再规范成了网络中最让人关注的词。网站还是这么多,只是国内的网站少了,仅此而已。

CSS HACK之IE6 IE7 IE8 FF兼容性


浏览器兼容性问题一直是前端开发中最让人头疼的问题之一,既然现在已经不能避免了,大家就想出很多很多方法来解决问题。通过JS来解决或者通过CSS来解决。一般来说,能通过CSS的就不通过JS,能通过JS的就不通过程序。记录几种通过CSS来解决网页冲突问题的方法,利用一些不同浏览器之间可读取的标识来解决。例如,下划线,星号等等。以下方法提供参考。

1.区别IE和非IE浏览器

#tip {
background
:blue; /*非IE 背景藍色*/
background
:red \9; /*IE6、IE7、IE8背景紅色*/
}


2.区别IE6,IE7,IE8,FF

【区别符号】:「\9」、「*」、「_」
【示例】:

#tip {
background
:blue; /*Firefox 背景变蓝色*/
background
:red \9; /*IE8 背景变红色*/
*background
:black; /*IE7 背景变黑色*/
_background
:orange; /*IE6 背景变橘色*/
}

【说明】:因为IE系列浏览器可读「\9」,而IE6和IE7可读「*」(米字号),另外IE6可辨识「_」(底线),因此可以依照顺序写下来,就会让浏览器正确的读取到自己看得懂得CSS语法,所以就可以有效区分IE各版本和非IE浏览器(像是Firefox、Opera、Google Chrome、Safari等)。


3.区别IE6、IE7、Firefox (方法 1)

【区别符号】:「*」、「_」
【示例】:

#tip {
background
:blue; /*Firefox背景变蓝色*/
*background
:black; /*IE7 背景变黑色*/
_background
:orange; /*IE6 背景变橘色*/
}

【说明】:IE7和IE6可读「*」(米字号),IE6又可以读「_」(底线),但是IE7却无法读取「_」,至于Firefox(非IE浏览器)则完全无法辨识「*」和「_」,因此就可以透过这样的差异性来区分IE6、IE7、Firefox


4.区别IE6、IE7、Firefox (方法 2)

【区别符号】:「*」、「!important」
【示例】:

#tip {
background
:blue; /*Firefox 背景变蓝色*/
*background
:green !important; /*IE7 背景变绿色*/
*background
:orange; /*IE6 背景变橘色*/
}

【说明】:IE7可以辨识「*」和「!important」,但是IE6只可以辨识「*」,却无法辨识「!important」,至于Firefox可以读取「!important」但不能辨识「*」因此可以透过这样的差异来有效区隔IE6、IE7、Firefox。


5.区别IE7、Firefox

【区别符号】:「*」、「!important」
【示例】:

#tip {
background
:blue; /*Firefox 背景变蓝色*/
*background
:green !important; /*IE7 背景变绿色*/
}

【说明】:因为Firefox可以辨识「!important」但却无法辨识「*」,而IE7则可以同时看懂「*」、「!important」,因此可以两个辨识符号来区隔IE7和Firefox。


6.区别IE6、IE7 (方法 1)

【区别符号】:「*」、「_」
【示例】:

#tip {
*background
:black; /*IE7 背景变黑色*/
_background
:orange; /*IE6 背景变橘色*/
}

【说明】:IE7和IE6都可以辨识「*」(米字号),但IE6可以辨识「_」(底线),IE7却无法辨识,透过IE7无法读取「_」的特性就能轻鬆区隔IE6和IE7之间的差异。


7.区别IE6、IE7 (方法 2)

【区别符号】:「!important」
【示例】:

#tip {
background
:black !important; /*IE7 背景变黑色*/
background
:orange; /*IE6 背景变橘色*/
}

【说明】:因为IE7可读取「!important;」但IE6却不行,而CSS的读取步骤是从上到下,因此IE6读取时因无法辨识「!important」而直接跳到下一行读取CSS,所以背景色会呈现橘色。


8.区别IE6、Firefox

【区别符号】:「_」
【示例】:

#tip {
background
:black; /*Firefox 背景变黑色*/
_background
:orange; /*IE6 背景变橘色*/}

【说明】:因为IE6可以辨识「_」(底线),但是Firefox却不行,因此可以透过这样的差异来区隔Firefox和IE6,有效达成CSS hack。

针对Chrome和Safari等Webkit核心浏览器的CSS hack代码:
@media screen and (-webkit-min-device-pixel-ratio:0) { /* Webkit内核兼容CSS */ }
示例:
@media screen and (-webkit-min-device-pixel-ratio:0) { .font1 {color:#f00} .border1 {border:1px solid #f00;} .bg3 {background:#f00;} }
除此之外,还有专门针对某个浏览器的CSS hack方法,如针对Webkit核心浏览器和Opera的写法:
/*Webkit and Opera*/ @media all and (min-width:0px){ .font1 {color:red;} }
针对Opera浏览器的写法:
/*Opera*/ @media all and (-webkit-min-device-pixel-ratio:10000),not and all (-webkit-min-device-pixel-ratio:0) { .font1 {color:red;} }
针对Firefox浏览器的写法:
/*Firefox*/ @-moz-document url-prefix() { .font1 {color:red} }
除了添加CSS hack以外,还应该给每个CSS hack加上注释,这样才能熟记于心,希望大家找到适合自己的方法。
解决IE6下在滚动鼠标的情况下,BORDER以及容器的背景和内容消失情况,使用IE6 HACK: _height:1px; 即可