时光博客 - WEB开发中的可用性和用户体验
全部文章

iPhone新软推荐:玩“在哪”,“在哪”玩

最近基于地理信息、即时信息、本地化SNS的手机应用大热,国外的如foursquare等。最近发现一款国内开发的应用“在哪”,玩了一下,有点心得,不敢独享,拿来分享。

“在哪”是什么?
“在哪”是基于地理位置信息,根据用户位置构成的本地化的SNS网络。使用”在哪”后,用户可以随时查看好友“在哪”,还可以给自己或好友去过的地点添加 评价,并且可以将好友的评价加入到自己的计划中。不仅如此,“在哪”还加入了部分游戏成分,用户可以通过“踩点”(到达地点)来获取虚拟币的奖励,并且根 据“踩点”的条件不同还可以解锁勋章。
贴士:如果你在一个地点“踩点”是最多的话,就能够当选为该点的“村长”。


“踩点”:告诉好友我“在哪”?
通过GPS查找到你附近的地点(如餐馆、酒店等),选择地点便可以“踩点”了,同时你的好友就会收到push,知道你“在哪”了。还有,“踩点”的同时可 以“放话”,添加照片 ,更加直观的方便好友看到。“踩点”的同时会有虚拟币(立方币)的奖励,条件触发的话还有勋章奖励,PS:勋章的设计个人感觉还是蛮酷的,只是我玩到现在 也之解锁了10个勋章,看下攻略,怎么拿到其他勋章;)。

“在哪”下载?
说了这么多,总归有知道“在哪”下载吧?
下载地址:http://itunes.apple.com/us/app/wwere/id358936566?mt=8
或者直接到iTunes里面搜索: Wwere 或者 在哪
应用主页: http://wwere.L99.com

火狐插件网页另存为图片

上网的是时候经常会碰到这样的情况,就是看到一个自己觉得比较漂亮和欣赏的网页,就想先存下来,研究下她的配色和框架结构,以前用的TheWorld,有相关功能直接保存为图片。但是为了观赏到HTML5技术和CSS3技术,响应下无毒安全浏览器,现在还是用Firefox比较多。今天突然发现了这款软件,真的不错。Pearl Crescent Page Saver ,试了下效果,确实不错,可以将页面和区域保存为图片,保存的图片为PNG或者JPG格式,图片名称为网页的title。来看看官方的说明:

Pearl Crescent Page Saver is an extension for Mozilla firefox that lets you capture images of web pages, including Flash content. These images can be saved in PNG or JPEG format. Using Page Saver, you can capture an entire page or just the visible portion. You can control the image capture process via a wide variety of settings, including the image file name and scale (e.g., save at 50% of original size).

免费版本下载地址:http://pearlcrescent.com/products/pagesaver/pagesaverbasic-2.5.xpi

时光博客下载地址:pagesaverbasic-2.5.xpi

HOHO,又解决了一个难题了!

新年快乐

好久没有写日志了ORZ...最近人变懒了许多了。也不爱动,周末也不爱出去,就宅在家里面。以前宅在家喜欢玩游戏,最近迷上了看电影,最近都在看美国的科幻片、恐怖片,突然发现一个人拿着笔记本看电影的情调不亚于去电影院的情调。新年到了,今年刚好本命年,24岁鸟,不小了,是要好好规划下人生的道路了。嘿嘿,关于什么规划这里就暂时不讲了,看过《越狱》的人都知道,计划赶不上变化。大体方向把握好就OK!

工作上呢,还是踏踏实实的工作,端正下工作态度,准时上班(不堵车的情况下),然后呢,按时保质的完成上面分配的任务。

生活上,要好好关心自己,突然觉得自己的身体都不如以前好了,可能是缺乏锻炼了,以后尽量少熬夜,多锻炼下身体,等搬到了新的住房,锻炼就多了,公寓下面有好多锻炼身体的设施。

感情上,希望一切都平稳发展吧^ ^。

新的一年,希望博友们身体健康,工作顺利。要好好爱自己。

JS innerHTML Double Quotes

通过jsinnerhtml来获取一个dom节点,内部的html值时,如果属性值没有空格,则ie左右版本下,都会出现标签大些,双引号丢失问题。如果属性值有空格,则标签会变成大写,引号则正常输出.看下面示例:

当属性值无空格时:
FF3.5.7(gecko/20091221)<div id="div2"></div>

IE6 弹出:<DIV id=div2></DIV>
IE7 弹出:<DIV id=div2></DIV>
IE8 弹出:<DIV id=div2></DIV>

有空格时:
FF3.5.7(gecko/20091221)<div id="div2 "></div>

IE6 弹出:<DIV id="div2 "></DIV>
IE7 弹出:<DIV id="div2 "></DIV>
IE8 弹出:<DIV id="div2 "></DIV>

产生这个BUG的原因是什么呢?

When you get the innerHTML of a DOM node in IE, if there are no spaces in an attribute value, IE will remove the quotes around it.IE's innerHTML doesn't remove quotes from non standard attributes.

即使是jQuery里面,jquery团队的技术人员也没有解决这个问题.

提供下解决方案:

  1. function ieInnerHTML(obj) { 
  2.      var zz = obj.innerHTML, 
  3.          z =  
  4.        zz.match(/<\/?\w+((\s+\w+(\s*=\s*(?:".*?"|'.*?'|[^'">\s]+))?)+\s*|\s*)\/?>/g); 
  5.       if (z){ 
  6.         for (var i=0;i<z.length;i++){ 
  7.           var y, zSaved = z[i]; 
  8.           z[i] = z[i].replace(/(<?\w+)|(<\/?\w+)\s/, 
  9.                               function(a){return a.toLowerCase();}); 
  10.           y = z[i].match(/\=\w+[?\s+|?>]/g); 
  11.            if (y){ 
  12.             for (var j=0;j<y.length;j++){ 
  13.               z[i] = z[i].replace(y[j],y[j] 
  14.                          .replace(/\=(\w+)([?\s+|?>])/g,'="$1"$2')); 
  15.             } 
  16.            } 
  17.            zz = zz.replace(zSaved,z[i]); 
  18.          } 
  19.        } 
  20.       return zz; 
  21.      } 

在相应的地方调用函数ieInnerHTML

  1. if(/*@cc_on!@*/0){ 
  2.     inner_str = ieInnerHTML(obj); 
  3. }else
  4.     inner_str = obj.innerHTML; 

 原理:对IE版本进行对应的JS处理,而且相应的元素标签中不要出现非标准元素

参考资料:

  1. innerHTML removes attribute quotes in Internet Explorer
  2. innerHTML中的双引号哪去了?

 

笔记本无线网卡共享上网

本文来自傻猫网络日志

无线网卡对联,也就是所谓的 HOC 方式。我的笔记本无线网卡是Intel(R) PRO/wireless 3945ABG,操作系统是Windows XP sp2,VISTA的或者WINDOWS 7在后面有写到。(不是所有的无线网卡都支持,不过大部分都支持。),今天晚上成功将M8用wifi与笔记本电脑连接成功,M8可以通过笔记本共享上网,也可以用飞鸽传送文件,非常方面,推荐中。(此方法由魅族论坛网友samogogo提供)
---------------------------------------------------
XP:
1、“网上邻居”右键“属性”,“无线网络连接”右键“属性”,选择“常规”旁边的“无线网络配置选项卡”,点右下角的“高级”,将“仅计算机到计算机”选上,还有将“自动连接到非首选网络”前面打勾。完成后点“关闭

2、回到”无线网络配置“,点中首选网络下面的添加按钮,自行输入网络名,本例中为“Test”,将“自动为我提供密钥”的对号去掉,将数据加密选项改成“已禁用”,确定返回。

3.共享本地连接:“本地连接”右键“属性”,选择“高级”选项卡,将“Internet连接共享” 下面的两个“允许”前面打勾,网卡将自动配置无线网卡IP为192.168.0.1,子网掩码为255.255.255.0。双击你的无线网络,会发现多了一个“Test”的无线网络出来,点击连接,然后打开你的M8搜索网络,如果能搜索到samogogo的无线网络,则恭喜你,配置无线网络成功。(如果你是宽带拨号,只需要在你的宽带拨号的属性里“高级”选项卡共享下网络也一样。)
------------------------------------------------------------
VISTA和WINDOWS 7的用户:
1.点击左下角的球球,“网络”上右键“属性”,进入“网络和共享中心”,VISTA点右边的“查看状态”按钮,WINDOWS 7点左边的“无线网络管理”按钮。
2.进入“无线网络管理”窗口,点左边的“添加”,OK,按向导的方法来配置吧。
“创建临时网络”--“下一步”--填写上你要的无线网络名,选择无身份验证,开放式,保存这个网络,下一步-------“关闭”,OK了。
3.第三步是共享本地连接网络,和XP类似。

ImageSwitch For jQuery

最近在寻找图片切换效果,在网上找到了个不错的jquery版的图片切换效果,支持多种样式,纯js实现,视觉上绝对不逊色于FLASH。废话不多说看下效果图

兼容性:完美兼容Firefox 3.5.5 for win ,IE6,IE7,IE8,其他浏览器未测试

独立预览地址:http://liupeng.us/demo/jQuery/ImageSwitch/

示例代码:ImageSwitch_jQuery.rar

jQuery Object and Dom

项目碰到一个问题,问题大概是这样的:

  1. <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
  2.     <tr class="line1" filetype="a"> 
  3.       <td></td> 
  4.     </tr> 
  5.      <tr class="line2" filetype="b"> 
  6.       <td></td> 
  7.     </tr> 
  8.   </table> 

需要对上面table的每个tr(N行)绑定事件,对filetype="a"和filetype="b"的绑定不同的的右键菜单。右键菜单是通过jQuery插件contextmenu实现的。

想绑定事件,自己只能想到2种方案:

  • 第一:使用jquery的选择符分别筛选出filetype为a和b的。
  • 第二:使用普通的dom对象,通过getAttribute实现。

第一种方法尝试了,发现jQuery不支持自定义选择符,也就是类似 $("input[name='newsletter']")的标签。可能也有,但是由于项目紧没有去尝试。

第二中方法,使用普通的DOM对象来获取不同的filetype,然后给tr做绑定,但是问题来了,jQuery的插件只支持jQuery对象。上网搜索了下发现原来DOM对象转换成jQuery对象非常简单,只要在DOM对象外面加入符号"$"就可以了。比如

  1. //普通的DOM对象 
  2. var otrs = document.getElementById("filelist").getElementsByTagName("tr"); 
  3.  
  4. //jQuery对象 
  5. jotrs = $(otrs); 

经常会碰到jQuery与原生的JS混写的时候,也不知道这样的效率如何,转换成jQuery对象的时候,会带来多大的性能损耗。

另外jQuery对象转换成DOM对象稍微要复杂一点,由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项,一般可通过索引取出。

  1. $("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5] 

这些都是dom对象,可以使用dom中的方法,但不能再使用Jquery的方法。
以下几种写法都是正确的:

  1. $("#msg").html(); 
  2. $("#msg")[0].innerHTML; 
  3. $("#msg").eq(0)[0].innerHTML; 
  4. $("#msg").get(0).innerHTML;