2012-12
22

MAP OF DESTINY滚动条改造成功

By xrspook @ 20:03:26 归类于:烂日记

2012-12-22_map01

2012-12-22_map02

看出这两个图的区别了吗?这就是我今天奋战大半天的成果!

啥?没看出来?不是吧,一个白色刺眼,一个没了!今天做了很表面化的工作——把默认滚动条改用jquery格式化了!这再也不是从前,很久很久以前在IE下用CSS就能修改搞定的东西。

建成MAP OF DESTINY 2012的时候,我就已经觉得那个只能必须内嵌的滚动条很刺眼了,当时也知道用jquery可以解决,但一直没有在那里花心思。直到今天偶尔看到介绍高级滚动条的文章,于是就试验了。

这次使用的是mCustomScrollbar,据说这是非常高级的玩意,没有做不到只有你想不到,太多隐藏功能,需要慢慢地去发掘,我就别不懂装懂了。

花了一个多小时就在静态页面中折腾出我想要的效果。但我的MAP OF DESTINY是动态加载的,需要加载Google Spreadsheet也需要加载Google Map。很不幸,这两种东西在天朝都需要翻墙。所以,这个地图做出来我的确不是为了给国人看的。这是给我自己看的,也是给外国人羡慕嫉妒恨的。理论上啊,静态网页测试成功的东西直接搬到map上就好,实际上不然。出现加载问题,翻墙、不翻墙、翻墙快慢会影响效果到底能不能显示出来。

很奇怪的现象,在不翻墙和翻墙速度快的情况下,网页一开始就告诉加载滚动条不成功,但在翻墙速度慢的时候加载反而OK。我的网速很好,但ouyansh的网速不好,于是在就形成了,我看不到效果,但他一开始就看到了。

经过一番周折后,ouyansh最终觉得那是网页加载延迟的问题,加了一个判断后,finally,finally,finally网页终于能在各种翻墙不翻墙以及网速的情况下都正确显示我的自定义滚动条效果了!!!

滚动条的样式是自定义的,我选用的是11px直径的圆点为滑块配合1px虚线的滚动槽,并不是用最传统的长条的滑块以及有一定宽度的滚动槽。所以,其实我冒着别人看不懂那是什么的风险做这个尝试的。因为这个效果是我最喜欢的,ouyansh说按照我的意思就好,别人就让他们忍忍吧。

在WWE全面开始放圣诞假期的今天,我闲得无聊,于是就有机会折腾这技术活了。

人是要勇于折腾的哈!

2012-10
1

睡了一下午

By xrspook @ 20:32:53 归类于:烂日记

我睡了一个整整下午,我妈看了整整一个下午的土豆视频。

昨天终于赶出了MAP OF DESTINY 2012 GMap版,这算是一个奇葩,因为Create a map from a published Google Spreadsheet我是昨天晚上才发现的。不过,奇葩归奇葩,当我发布文章的时候已经是今天凌晨2点,发布点点的时候更加已经是凌晨的2:40,所以,你大概明白我为啥睡了一个下午了吧。

其实我对做这种事有点忌讳,不能熬夜,我知道,但往往干这些事我就不知不觉地熬夜了。我只是想把事情干完,不想拖着心事去睡觉,仅此而已。这或许能解释为啥我每天都能很快入睡。因为我的心空荡荡的无牵挂。

今天下午睡得并不踏实,醒来N次,做了些乱七八糟的梦。

明天嘛,要出门走走了,窝在家里会发疯的。不过,起码要下午再出门,因为上午有3小时的Raw,而那个该死的各种信息起码要到中午12点WWE.COM才会发布完全。我怨念他们的啊,一直都很怨念~~~ 为啥要3小时!

我这个狂人,没有给自己哪怕一天的休息时间,我为什么要这样折磨自己呢?

这个国庆,我有个愿望,把新买的《霍乱时期的爱情》看完。我有时间有心思做到吗?

但现在,我只是满脑子的timemap,囧。

2012-09
30

MAP OF DESTINY 2012闪亮登场

By xrspook @ 23:59:49 归类于:烂日记

正是因为我不是专业的程序员,所以才显得很有价值!

今天,我花了一些时间去思考timemap用不同颜色戳的问题,如何让theme和某列元素里的某数据建立关联?应该可以的,绝对可以的,不就是一个条件格式么,但怎么做呢?在网页里调用excel文件,约等于是在调用一个可视化程度挺高的数据库,这就让我想起了邮件合并。

今天,我运气非常的好,搜索Google Map Spreadsheet居然被我发现了一个Google官方的好东西“Create a map from a published Google Spreadsheet”,啊啊啊啊啊啊啊啊啊!这就是我的思路!但Google的这个页面居然连网页标题都没有…… 这个东西,其实就是南方周末 – 新闻地图的原始版。Google Spreadsheet上的数据库我已经发布,数据也是齐全的,所以,可以说我轻易就能生成一个简易版。通过一些手动修正和网页格式统一,我的destiny-map-2012横空出世了!这个是gmap版,所以全称是destiny-map-2012-gm,我还要做timemap版的,预留名字是destiny-map-2012-tm。

有截图有真相。

MAP OF DESTINY 2012 GMap版在这里

欢迎各种测试!提前说明,大于100的编号没有在地图的绿色戳上显示,因为G老师认为大于两位数的编号小小的戳hold不住了,所以直接那个位置显示空白,这个不是bug。

网页延续着DESTINY IS REAL主站的黑金风格,估计是没什么办法把这个套在点点网页里的了,除非我用ifame。gm版这么快就可以上线其中一个很重要的原因是Google生成的简易版就一个单网页文件,其中引用了2个东西,一个是数据源的Spreadsheet,一个是Google Map的API。相比之下,timemap的数据库的一些引用我仍未完全摸透。啊啊啊,今天我才发现原来现在使用Google Map API是完全不需要用API KEY的了,尽管,我已经申请,V2和V3都有申请,那个的话,每天查询的免费次数有限制,如果不填KEY也能实现功能的话,这个所谓限制等于浮云。这种事件地图我只是私用,即便挂在网络上也不会有多大浏览量,但谁知道不会不会有神经质发神经呢。

我对自己的工作成果和效率表示很满意,哈哈哈。

PS:惊讶的发现,这个页面在Firefox、Opera、IE在天朝都能正常浏览,但Chrome,悲催的需要翻墙。搞不懂了,Google和Google的业务有矛盾?????所以,如果在天朝你想用Chrome打开,但又不懂翻墙的话请把下面这堆东西加入到host(C:\Windows\System32\drivers\etc\hosts)。

203.208.45.200 spreadsheet.google.com
203.208.45.200 spreadsheets.google.com
203.208.45.200 spreadsheets.l.google.com
203.208.45.200 spreadsheets0.google.com
203.208.45.200 spreadsheets1.google.com
203.208.45.200 spreadsheets2.google.com
203.208.45.200 spreadsheets-china.l.google.com
203.208.45.200 spreadsheets-opensocial.googleusercontent.com

Page 1 of 11
COPYRIGHT @ 我的天 | Theme by xrspook | Power by WordPress | Valid XHTML 1.1 and CSS 3 Go to top