Archive for 十一月 2009
“Pivot浏览器”是Windows Live Labs实验室出品的一款软件，微软的Windows Live Labs实验室非常擅长图形的处理应用。这款最新的超级浏览器可谓是目前所有浏览器中的极品，可以说是全新的技术，在这款浏览器上基本已经看不出Internet Explorer的影子了。
有网友率先拿到了Pivot浏览器的内测资格，还添加了截图来跟大家一起分享。根据微软官方给出的消息，这款软件目前只能支持在英文版的Windows 7系统上面安装！如果你是中文版的Windows 7系统用户想要现在体验一下这款浏览器只有安装英文版的Windows 7系统，安装成功以后在改回中文也可以继续使用。
不过国内也有用户在中文版的Windows 7系统上成功的安装了“Pivot”浏览器，该用户的操作系统是Lenovo Windows 7 Ultimate 6.1.7600.16404 简体中文版，安装“Pivot”浏览器的时候使用的邀请码是923D5325F66B7359。有兴趣的朋友也可以下载下来安装体验一番。
软件下载地址：http://www.getpivot.com/developer-info/
Pivot浏览器的分类管理功能也是无比友好和强大。
微软在地址栏的左边添加了一个“go”的下拉选项，里面添加了bing的搜索，很明显，微软正在完成bing的推广计划，在对抗网络搜索巨头Google。
微软还在Pivot中加入了新的元素，这个按钮觉得熟不熟悉啊？这就是快速拨号，不知道Opera会不会和微软干上。
Pivot目前也有缺点，就是还不能支持jump list的功能。
Pivot的浏览历史记录的功能非常的强大，打开浏览历史记录，曾经浏览过的历史记录全部显现出来了，而且动画效果更加明显，收藏夹的添加也更加人性化。
到文章发稿为止，小编还没有体验到“Pivot”浏览器的强大功能，不过从网友提供的截图来看，不得不感叹微软也可以把浏览器作的这么精致！记得以前很多网友老是在抱怨微软做的浏览器太粗糙，现在微软终于用实际行动回应了那些用户的抱怨。这款浏览器除了非常精致以外，浏览器的功能也是做的越来越人性化。结合上周微软在技术大会公布了IE9的开发计划，微软目前推出Pivot浏览器很容易让人联想到这会不会跟ie9是否存在一定的关联，莫非Pivot将是IE9浏览器的预览版，这将更加让人对IE9浏览器和Pivot浏览器充满期待。
No tags
这次的任务需要用到脚本了,我们要实现一个任务栏的东西,页面上所有的container层都可以最小化到这个任务栏的层中,如果本来的层是绝对定位的(position:absolute),则最小化之后再次恢复到原来的状态时,会回到原来的位置,而如果本来的层是相对定位的(positoin:relative),则层不会记住原来的位置,因为它是流动的,每次恢复状态的时候,层都将加入到文档流中,随着文档流变化,所以对于绝对定位的层来说这种最小化更具有意义.
具体效果可以去看我的博客(用firefox或者chrome浏览)我的博客主题被我改成了wave了,而且可以最小化层:
本文demo请见:http://www.coderbbs.cn/UED/google-wave-test.html
大家可以去体验一下google wave,目前需要邀请才能使用,我这里还有6个邀请名额,可以留言给我.
前面一篇文章已经实现了布局,但是不支持ie,虽然我的博客(http://www.coderbbs.cn)经过改进,支持了ie,但是这次加了脚本后,ie再次出现布局问题,我决定放弃ie,直接给出chrome的链接.虽然用ie7可以浏览本站,但是看不到这篇文章描述的效果,脚本被我屏蔽,ie8可以看到效果,但是有布局bug.等有时间了我再解决.
我估计google wave一上线,ie的大限就到了,chrome市场份额必将大升,不过wave占用内容超高
我们接着上次,这次要实现层的最小化,并且让所有的层都最小化到一个任务栏里,而且是可以恢复原状的,我们首先要布局出最小化后的层的样式,用到了三个新的图片:
前三个是新的圆角和边框,后面的貌似是空白的其实是标题栏右上角的几个按钮,因为是白色的,所以看不到效果,图片都是png,ie6不支持.
下面就要考虑怎么最小化某个层了,而且我们要保存它的位置和大小信息,以便可以恢复原来的样子.
恩呵呵,我首先想到的就是设置两种样式,一种是正常的样式,一种是最小化后的样式,正常的样式叫做”container”最小化后就叫做”container-min”,我将容器中的所有的样式都设置两份,一份是正常的样式,一份是最小化后的样式.例如:w-bd,是主体内容的样式,我修改后,分别在css中定义.container .w-hd和.container-min .w-hd,其中前一个是正常的样式,后一个则设置display:none;其他各个圆角和边框均设置两套,然后我在js中切换className.
例如:下面是点击最小化按钮后执行的函数:
var min_handle=function(){
this.parentNode.className= this.parentNode.className.replace("container","");
if(this.parentNode.className.indexOf("container-min")==-1)
this.parentNode.className+=" container-min";
min_stack.add(this.parentNode)
}
意思就是我首先将层的className中的container去掉,然后换成container-min,后面检测了一下,确保只加入一次,ok就是这样简单,无需其他操作,这时候层就最小化了.再加个最大化的点击函数:
var max_handle=function(){
this.parentNode.className= this.parentNode.className.replace("container-min","");
if(this.parentNode.className.indexOf("container ")==-1)
this.parentNode.className+=" container";
min_stack.remove(this.parentNode)
}
然后绑定一下事件,现在所有的层都可以最大化和最小化了,效果还不错来着.那么上面函数里的最后一句是什么呢?
别忘了,我们要最小化到任务栏,而不是原地不动.min_stack是一个单例对象,承载着一个任务栏的角色,他的构造如下:
var min_stack=function(){
return {
stacker:new Array(),
parent_stacker:new Array(),//记住父元素
str_stacker:new Array(),//记住初始标题字符串
container:document.getElementById("min-stack"),
now_width:0,
width:140,
x_count:0,
add:function(ele){
var boo=false;
for(var i=0;i
7) Dom.getElementsByClassName("w-hd","div",ele)[0].innerHTML=hd_html.substr(0,6);
}
},
remove:function(ele){
for(var i=0;i
它有两个方法:add()和remove(),顾名思义,add就是将一个元素添加到任务栏,remove就是移除一个元素;
这里面我们做了一些特殊的工作,当add()一个元素的时候,我们首先判断是不是已经添加过此元素了,防止出错,然后我们记住它的父元素,之后恢复的时候就可以将其送回父元素里面,然后我们清楚了它的位置信息,这一步很重要,每个元素都有本来的位置,我们将其添加到任务栏的时候要清除这些样式,我们用添加一个clear_position的class的方法来覆盖位置信息,之后我们可以移除此class来恢复位置信息,之后我们把层从其父元素里移出来添加到任务栏里,设置特殊样式,然后去掉最小化按钮,增加恢复按钮,之后我们将标题字数限制为6个,并记住标题信息.之后可以恢复.
在这里我们记住了很多东西,之后都可以恢复,然后层就可以回到原来的样子了.
其实就是这样简单.脚本很少,以至于我都不想封装了,直接写出来.呵呵
下一步,我想研究下所见即所得编辑器,前几天开碳酸饮料会的时候讲到的,既然有人讲到就去研究研究.
作为一个练习,今天下午研究了下wave的样式,然后把自己的博客改版了一下,改掉了原来的简洁版,看着还不错,有些细节fangmian还没有处理,拍个照留念下:(本站目前不支持ie6,因为ie6对png渲染有问题)
No tags
前几天收到了一个google wave的邀请,说实话我对这个东西没啥兴趣,没时间去研究他到底是干什么的,但是作为一个前端,还是应该关心一下这些东西的,于是看了一下这玩意,看到第一眼嚼的好经验,我立即好奇起来,这种阴影好神奇啊,是咋做出来的呢,我去网上搜了一通,没有发现制作阴影的文章(除了那种粗糙的阴影),于是我用ff把它涉及到的图片都扒了下来,第一时间自己用这些图片组建了这种样式,可能我的方法和google有所出入,但是效果的确是出来了:如下图:
要看源代码和真正的效果,请点击这里:(请用firfox或者chrome打开此链接,不支持ie)
http://www.coderbbs.cn/UED/google-wave-test.html
有一点需要注意,这种样式在ie中不支持,我想这也是为什么google wave在ie里需要给ie装一个chrome frame的原因,在ie里显示的提醒页也有这种阴影样式,但是那是一个固定层,只有一个背景图片,无法实现层大小的改变,具体是因为ie中如果不设置层的宽度,只设置left和right,层并不会自己延伸,造成无法实现这种效果.具体可以自己实验
下面开始说原理:
wave里应用了如下的图片来实现阴影和圆角(其中省略了几个用来修饰bug的小图片,不影响效果)
其中各用在:1-标题背景;2-标题右边;3-内容体由边框;4-标题左边;5-右下角圆角;6-内容体下边框;7-左下角圆角;8-内容体左边框
首先我们需要构造一个html结构,外边是一个总的容器,里面包括修饰层,标题层,内容层:
html代码,只写了一个
标题
接着是我们要分布各个图片的位置:
这个容易看出,首先在css里设置各个修饰层为绝对定位,包括标题和内容层,让他们相对最外层的container定位,所以在使用的时候,外面的层必须设置position属性,如果不设置就不能正确显示.
然后把各个层的大小设置为和图片相同,设置背景图像,这些也没什么难的,然后定位即可,其实在定位这里我卡住了一会,效果总是不理想,本来我不打算将内容单独设置成一个层的,后来发现必须将内容和外边的包装层分离开来才行,只要定位好位置,就行了.
还有一个问题,那也就是为什么ie不支持这种布局的原因,因为我这里的标题层需要随着外层的变化而变化,所以我不能定死它的大小,也不能设置百分比,也就是我不能设置它的大小,只能同时设置他的left和right,这个时侯,浏览器会自动计算他的大小,但是在ie里浏览器不会计算他的大小,造成大小不能自动改变,也就是在ie里,不能让里面的层随着外边的层的大小的改变而改变(注意:是里面随着外边),而在其他浏览器里这是可以的,如果你想在ie显示这个,可以去装个chrome frame for ie
(全文…)
27
关键词:网页键盘,淘宝导航链接的改进,这篇文章只是教程,下面再来一篇关于淘宝页码导航
3 Comments · Posted by admin in 前端开发, 可用性研究366 个打酱油的来压过马路
为了版面整洁,详细介绍请见:
http://www.coderbbs.cn/UED/taobao-nav.html
No tags
这是我的最初设计稿,呵呵
No tags
我是在十一月份初在Javaeye首页上看到淘宝开放平台的消息的,在初步了解这个平台后,我立即产生了好几个想法和点子,这都要归功于淘宝开放平台的特殊性和优越性.以前,考虑校内网之类的SNS的开放平台,盈利方面总是困扰着我,不能盈利的产品是存活不下去的.然而在top平台上我看到了清晰的盈利模式,例如:用户通过我的应用买下了某个商品,我就能得到提成.对于开发者来说,这种盈利模式简单明了,无需了解过多的商业运作知识.
之后我对自己的点子进行了细化,然后准备一一实现,我其实是想参加top应用大赛,争取获取大赛的创业基金,将自己的想法一步步实现并扩大.可是老天爷真会开玩笑啊,过了没几天我接到了淘宝网的电话,之后获取了到淘宝UED实习的机会,实习之后,时间显然不足以让我来完成自己的想法,可能会错过这次比赛,但是以后我会慢慢来实现它们的,而且我的女朋友也正在打算在淘宝开店,我想她会成为我的第一个客户的,呵呵.
这里我只拿我的几个比较宽泛的想法来谈自己对top平台的理解,为自己保留一条秘密,同时也跟大家分享自己的想法.
现今社会,很多产业都已经趋向于饱和,例如:超市行业.在南京,苏果超市占据了绝对地位.随处可见其身影,当然也有类似华联和家乐福之类的超市,但是好像有的话也很少,而且都是旗舰店,这是因为这些超市靠的就是利用规模来和苏果超市竞争的,苏果遍地开花,成百上千,而且也有不少旗舰店,在这种情况下,要想抢的一席地,只能靠规模和价钱来吸引客户.可是最近,在新街口出现了很多新型超市,上次和朋友去逛街了解行情,问了一下,原来他们都是从香港来的,问他们抢占市场的手段是什么呢?呵呵,看超市里卖的东西就知道了,总结起来就是一个新兴词语:垂直行业.香港人的确有商业头脑,他们超市里大多数卖的都是化妆品,当然也有其他东西,但是只是作为附属品而已,这和普通的化妆品店不同,他们卖的化妆品的包装上都印着他们公司的名称,类似贴牌生产,也就是他们公司跟各种著名化妆品公司合作,具体模式他们不肯透露,但是这种利用垂直行业来参与超市竞争的做法已经足以让我们恍然大悟了.其实在他们说出垂直行业这个词后我就立即联想到了互联网的垂直搜索服务,毕竟自己是做互联网的,其实互联网上也新兴起不少网站,靠的就是垂直搜索服务,现在百度和Google已经基本垄断了搜索行业,类似于超市行业,也只有像搜搜和bing这样的有着庞大后台的搜索服务才能参与一下竞争,瓜分一点市场,但是如果是个人或者小公司,想抢占搜索的大市场基本是不可能的,但是我们可以做垂直搜索,只搜索某一块,例如搜索宠物信息,搜索住房信息,餐饮信息,然后在此基础上添加诸多针对此领域的特殊服务,这点很重要,google其实已经提供了上述服务了,但是我们可以通过来提供更多个性服务来增加自己的竞争力.我其实也正在策划做一个公益性的垂直搜索网站,可能会争取到政府的资金支持,但是目前我除了我女朋友还没有跟任何人透露过,如果有人对此感兴趣可以找我讨论.
上面说了一大堆,其实就是一个词”垂直”.上次去东南大学参加阿里巴巴的笔试宣讲会,当时我去的有点晚,只听了一点点,其中看到某位老师讲淘宝的战略,看到了个性化店铺这个东西,记不得举得是哪个例子了,好像是个买衣服的,我觉得这种模式就是一种垂直的例子,虽然基本概念有点区别,但是将某种物品从淘宝独立出来,然后加以专门的修饰和提供相关的服务,这种模式和垂直行业也算有着很深的渊源.而这种模式正是通过淘宝开放平台来实现的.将某类商品独立出来,然后加上一些特殊的服务,我觉得在垂直领域,后面的这一条显得更为重要,例如:针对衣服,我们可以提供个性化印染,自己选择图案,自己选择颜色,自己决定大小,甚至自己设计衣服,在现在这种彰显个性的社会,这种服务显然更受欢迎.
利用上述的特性,我们可以做一些个性化强烈的行业,例如:礼品行业,在蛋糕上印上自己的名字,在日记本上印上自己设计的图案,家居行业,自己来设计自己的小家,在枕头上印上小两口的合影,自己决定家具的尺寸,甚至自己设计家具.看起来实现有点困难,只是提供一个思路而已,可以对照着淘宝上的产品分类来一一考虑.
其实我还有一个和上述思路完全相反的想法,上面是说垂直,下面就来说说整合,同样,我们拿现实世界来类比,其实网络就是现实的一个虚拟,我们完全可以拿现实中的成功案例来推导到互联网的模式,其实灵感的来源都是来自生活而已.大家有没有想过逛淘宝跟逛超市一样呢?如果你说你想到了卓越和当当,OK,是的,我说的大概就是这种体验,我们在商场选购东西,然后最后在柜台一起结算(不止如此,请继续往下看),省了挨个结算的路费和精力,超市就是这么诞生出来的,将各种商品整合在一起,我们只需要逛一趟超市,OK,一切生活用品都搞定了,卓越和当当的确类似这种模式.可是要知道,当当和淘宝完全是两种模式,淘宝是C2C,当当是B2C,当当实现这种模式是理所当然的,完全没有新意的,然而如果在淘宝上实现这种体验的话,是不是充满新意呢,我们终于可以像逛超市一样逛淘宝了,买了很多东西后,我们可以一起付款了,运费我们合起来算,(忘了强调一点了,这里的运费一起算,不是类似淘宝的那种结余的模式,而是像我们买了10件商品,每一件从不同的商家买的,都是很轻的东西,加起来的运费其实和单件的运费一样多,如果是平常,我们要付10份运费,而如果我们只需要付一份运费呢?这正是我这个方案的好处所在,也正是其重点所在)
刚才强调了这个模式的重点,那就是为购买者节省邮费,那么如何来实现这种模式呢,怎么将不同的商家整合在一起协调邮费呢?当然让商家自己去协调是不可能的,我们需要即时性,也就是不能等着打击去协调,我们需要一个中间平台,将邮费这一块独立出来由我们处理.听起来有点混乱,的确要实现整合很困难,我思考了很久,想出了一种方法,但是不太成熟,在此基础上有很大的发掘空间,这里就简单说说:(下面用”我”来代指开发商或者服务提供商)
首先,我要整合的商家必须是某一个地域范围内的,因为我要协调所有的商家,在此我要能够及时联系他们,及时提货,这类似一个的确商业联盟.
我充当中间服务商,我建立一个平台,显示所有加盟的商家,他们都是我这个城市的,他们的商铺涵盖各种领域,我们整个加起来就类似一个包罗万象的超市,应有尽有.
买家来到我们的平台,通过平台浏览各种商品,买下各种商品,这些商品的标价中均不包含运费,最后买家要结算了,他在结算界面会发现我们为他计算好的邮费,这些邮费是我们根据商品数量和重量计算出来的,如果买家不满意可以协商,注意,这里的运费绝对比平常在多家店铺买东西后的叠加运费便宜的多,买家确定提交,付款后,我负责为买家收集商品,我会联系各个商家提取商品,然后最后一起发货快递到买家地址.在此中间有多个环节可以盈利,首先是平台的广告费,然后是邮费中可以抽取出一部分费用,然后还有向加盟商家收取费用,我们帮他们卖出了更多的商品.
这个想法不是一个人可以实现的,需要形成一个产业链,而且我的想法也并不是非常成熟,只是临时性想法而已,我只是在朝着一个方向考虑问题,一个是垂直,一个是整合,任何产业发展到一定阶段都要经历到这些变革,淘宝也需要我们去改变它.
淘宝开放平台对于开发者和运营商来说绝非只是一个应用平台,我们完全可以以此平台为基础形成一种新的商业模式,形成一种新的产业链.个人开发者可以做一些小的应用,有趣的应用,无需太多人力的工具来吸引用户,利用淘宝开放平台提供的基本盈利模式来盈利,团队式开发者则可以考虑提供更多个性化服务来吸引用户,企业开发者则可以考虑将自己现在的业务和淘宝开放平台整合,形成新的产品体系.
每个开放平台的潜力都是无限的,它给开发者提供了足够的用户来源,我至今还记得当年facebook开放自己的平台的时候的诸多争论,现在一切都证明,这种举措是无比明智的,它方便了用户,也方便了开发者,给用户提供了更方便的应用,给开发者提供了足够的用户基数.总之,淘宝平台一定会跟其它平台一样红火的,而且借助它的特殊身份和特性,毕竟成为将来几年内的行业领导者.最后祝淘宝开放平台越来越完善,带领着一大批开发者走向充满希望的明天.谢谢赏光.
2009年11月16日1:25:55 孙信宇 写于 杭州
No tags
呵呵,作为测试页吧
No tags
欢迎使用 WordPress 。这是系统自动生成的演示文章。编辑或者删除它，开始您的博客！
No tags
