試用Opera11.10 build2053 版本的speed dial功能
背景
實(shí)驗(yàn)網(wǎng)站:奇團(tuán)網(wǎng)Qeetuan.com
如果你想看下效果,安裝Opera11.10版本,在快速撥號(hào)(speed dial)面板上加一下http://qeetuan.com即可!新打開一個(gè)tab默認(rèn)顯示的東東就是傳說(shuō)中的快速撥號(hào)了~
下面分享下本次制作speed dial的體驗(yàn)。
過(guò)程
我采用的是X-Purpose的方式。
按步就班(詳見(jiàn)上面的文檔),
1,在qeetuan.com網(wǎng)站根目錄下建一個(gè)preview.html
2,在apache上做rewrite
3,定制preview.html的內(nèi)容
opera11.10 speed dial的一些經(jīng)驗(yàn)和遇到的問(wèn)題
1,官網(wǎng)上推薦的speed dial內(nèi)容的寬為260px,高度195。
但實(shí)際上speed dial面板的標(biāo)題占用了大約28像素的高度!最終比較合適的推薦高度應(yīng)該是155像素

2,對(duì)于使用view-mode:minimized控制speed dial內(nèi)容的樣式
官網(wǎng)上說(shuō)可以使用外聯(lián)css文件
<link rel=stylesheet type="text/css" href="minimizedstyles.css"
media="(view-mode:minimized)">
但實(shí)際上如果使用外聯(lián)css文件,對(duì)speed dial內(nèi)容的渲染不起作用,就跟不指定media="(view-mode:minimized)" 一樣!
所以如果使用view-mode:minimized進(jìn)行css渲染,需要直接使用style標(biāo)簽寫在頁(yè)面內(nèi)!
另外,使用X-Purpose的方式,preview.html里面不要有html的注釋標(biāo)簽“<!---->”,否則speed dial渲染時(shí)可能會(huì)有問(wèn)題!
3,preview.html要結(jié)合view-mode:minimized才能完美地實(shí)現(xiàn)效果
如果你使用preview.html,但是css樣式?jīng)]有指定view-mode:minimized,那么speed dial在獲取preview.html的快照時(shí)會(huì)將它當(dāng)成普通的html頁(yè)面獲取,就是說(shuō)會(huì)縮放你的內(nèi)容。
4,speed dial一個(gè)比較嚴(yán)重的bug,
當(dāng)你將speed dial的刷新頻率由never改成別的頻率后,手工刷新一下speed dial的內(nèi)容,
你會(huì)發(fā)現(xiàn)“整個(gè)speed dial的內(nèi)容被縮放了N倍”!有圖為證,有木有!有木有!
改之前,

改之后,=悲劇發(fā)生了。。。

關(guān)于opera11
總的來(lái)說(shuō),opera11還是很給力地,無(wú)輪從UI還是速度上來(lái)說(shuō)都比以前的版本有了長(zhǎng)足改進(jìn),新增的speed dial功能很新鮮,至少chrome沒(méi)有,有木有!ff也沒(méi)有,有木有!
期待正式版的發(fā)布。

浙公網(wǎng)安備 33010602011771號(hào)