<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Tofu &#187; WEB</title>
	<atom:link href="http://tofu.im/blog/category/web/feed/" rel="self" type="application/rss+xml" />
	<link>https://tofu.im/blog</link>
	<description>Tofu is the best food all around the world!</description>
	<lastBuildDate>Sun, 29 Apr 2012 07:58:31 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<item>
		<title>各種花</title>
		<link>https://tofu.im/blog/2011/03/21/%e5%90%84%e7%a8%ae%e8%8a%b1/</link>
		<comments>https://tofu.im/blog/2011/03/21/%e5%90%84%e7%a8%ae%e8%8a%b1/#comments</comments>
		<pubDate>Mon, 21 Mar 2011 08:56:59 +0000</pubDate>
		<dc:creator>Csineneo</dc:creator>
				<category><![CDATA[WEB]]></category>
		<category><![CDATA[圖]]></category>
		<category><![CDATA[碎語]]></category>
		<category><![CDATA[CSS3]]></category>
		<category><![CDATA[Opera]]></category>
		<category><![CDATA[transform]]></category>

		<guid isPermaLink="false">http://blog.csineneo.com/?p=917</guid>
		<description><![CDATA[在豆瓣看到各種花，於是就寫了這麼一個小東西： http://t.csineneo.com/chrissie.php 效果不如相冊裏的那些好看，字體是一個因素，角度也需要微調下，不過勉強也能畫出些花來]]></description>
			<content:encoded><![CDATA[<p>在<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3d3dy5kb3ViYW4uY29tL3Bob3Rvcy9hbGJ1bS8zOTI3OTI1NS8=">豆瓣</a>看到各種花，於是就寫了這麼一個小東西：</p>
<p><a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3QuY3NpbmVuZW8uY29tL2Nocmlzc2llLnBocA==">http://t.csineneo.com/chrissie.php</a></p>
<p>效果不如相冊裏的那些好看，字體是一個因素，角度也需要微調下，不過勉強也能畫出些花來</p>
<p><img src="http://tofu.im/blog/files/2011/03/d1.png" alt="" title="d1" width="524" height="537" class="aligncenter size-full wp-image-929" /></p>
<p><img src="http://tofu.im/blog/files/2011/03/d4.png" alt="" title="d4" width="313" height="329" class="aligncenter size-full wp-image-930" /></p>
 <img src="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=917" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>https://tofu.im/blog/2011/03/21/%e5%90%84%e7%a8%ae%e8%8a%b1/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>WebM Video</title>
		<link>https://tofu.im/blog/2010/05/21/webm-video/</link>
		<comments>https://tofu.im/blog/2010/05/21/webm-video/#comments</comments>
		<pubDate>Thu, 20 May 2010 20:44:45 +0000</pubDate>
		<dc:creator>Csineneo</dc:creator>
				<category><![CDATA[Opera]]></category>
		<category><![CDATA[UserJS/CSS]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[視頻]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Snapshot]]></category>
		<category><![CDATA[UserJS]]></category>
		<category><![CDATA[Video]]></category>

		<guid isPermaLink="false">http://blog.csineneo.com/?p=533</guid>
		<description><![CDATA[Google I/O 大會上開源了 VP8，推了新的 WebM 格式，HTML5 video 編碼格式之爭應當快結束了。 Opera 的 WebM/VP8 支持是阿飛同學做的，一個說著一口流利中文的瑞典人 Windows (國際版) &#124; Windows (英文版)Mac (通用版) &#124; Mac (僅 Intel CPU)Ubuntu 32bit &#124; Ubuntu 64bit 對於之前版本的 Opera 10.5x 可以下載下面的壓縮包解壓到安裝目錄中的 gstreamer 文件夾 gstreamer_webm.7z 下面是一個 WebM 視頻，同碼率下畫質相對於之前壓制的 ogg 格式要好上不少 非常遺憾您的瀏覽器不支持 HTML5 Video Tag，建議您使用 Opera 瀏覽器訪問此頁面，點此下載 WebM 格式視頻 這裡還有一個還原 Youtube HTML5 視頻控制條為 Opera 默認樣式的 UserJS // [...]]]></description>
			<content:encoded><![CDATA[<p>Google I/O 大會上開源了 VP8，推了新的 WebM 格式，HTML5 video 編碼格式之爭應當快結束了。<br />
Opera 的 WebM/VP8 支持是<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL2Jsb2cuZm9vbGlwLm9yZy8=">阿飛</a>同學做的，一個說著一口流利中文的瑞典人</p>
<p><a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3NuYXBzaG90Lm9wZXJhLmNvbS93ZWJtL09wZXJhXzEwNTRfMjE4NjhfaW4tV2ViTS5leGU=">Windows (國際版)</a> | <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3NuYXBzaG90Lm9wZXJhLmNvbS93ZWJtL09wZXJhXzEwNTRfMjE4NjhfY2xhc3NpYy1XZWJNLmV4ZQ==">Windows (英文版)</a><br /><a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3NuYXBzaG90Lm9wZXJhLmNvbS93ZWJtL09wZXJhXzEwLjU0XzIxODc0LVdlYk0uZG1n">Mac (通用版)</a> | <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3NuYXBzaG90Lm9wZXJhLmNvbS93ZWJtL09wZXJhXzEwLjU0XzIxODc0X0ludGVsLVdlYk0uZG1n">Mac (僅 Intel CPU)</a><br /><a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3NuYXBzaG90Lm9wZXJhLmNvbS93ZWJtL29wZXJhLTEwLjU0LTIxODY3LXdlYm0uaTM4Ni5saW51eC50YXIuYnoy">Ubuntu 32bit</a> | <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3NuYXBzaG90Lm9wZXJhLmNvbS93ZWJtL29wZXJhLTEwLjU0LTIxODY3LXdlYm0ueDg2XzY0LmxpbnV4LnRhci5iejI=">Ubuntu 64bit</a></p>
<p>對於之前版本的 Opera 10.5x 可以下載下面的壓縮包解壓到安裝目錄中的 gstreamer 文件夾<br />
<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cHM6Ly90b2Z1LmltL2Jsb2cvd3AtY29udGVudC9maWxlcy8yMDEwLzA1L2dzdHJlYW1lcl93ZWJtLjd6">gstreamer_webm.7z</a></p>
<p>下面是一個 WebM 視頻，同碼率下畫質相對於<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cHM6Ly90b2Z1LmltL2Jsb2cvMjAxMC8wNC9odG1sNS12aWRlby8=">之前壓制的 ogg 格式</a>要好上不少<br />
<video controls preload="metadata"><source src="https://tofu.im/blog/video/WorldBuilder.webm" type='video/webm; codecs="vorbis,vp8"' />非常遺憾您的瀏覽器不支持 HTML5 Video Tag，建議您使用 <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL29wZXJhLmNvbS8=">Opera 瀏覽器</a>訪問此頁面，<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cHM6Ly90b2Z1LmltL2Jsb2cvdmlkZW8vV29ybGRCdWlsZGVyLndlYm0=">點此下載 WebM 格式視頻</a></video></p>
<p><a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL2V4dGVuZG9wZXJhLm9yZy91c2VyanMvY29udGVudC95b3V0dWJlLWh0bWw1LW5hdGl2ZS1jb250cm9scw==">這裡</a>還有一個還原 Youtube HTML5 視頻控制條為 Opera 默認樣式的 UserJS</p>

<div class="bwp-syntax-block clearfix">
<div class="bwp-syntax-toolbar"></div>
<div class="bwp-syntax-wrapper clearfix bwp-syntax-advanced"><div class="javascript"><ol><li style=""><div style=""><span style="color: #006600; font-style: italic;">// ==UserScript==</span></div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #006600; font-style: italic;">// @include *.youtube.com/watch?v=*</span></div></li>
<li style=""><div style=""><span style="color: #006600; font-style: italic;">// ==/UserScript==</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp;</div></li>
<li style=""><div style="">window.<span style="color: #660066;">setTimeout</span><span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; <span style="color: #003366; font-weight: bold;">var</span> vid<span style="color: #339933;">=</span>document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'video-player'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></div></li>
<li style=""><div style="">&nbsp; vid.<span style="color: #660066;">removeChild</span><span style="color: #009900;">&#40;</span>vid.<span style="color: #660066;">children</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">4</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; vid.<span style="color: #660066;">removeChild</span><span style="color: #009900;">&#40;</span>vid.<span style="color: #660066;">children</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">2</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></div></li>
<li style=""><div style="">&nbsp; vid.<span style="color: #660066;">children</span><span style="color: #009900;">&#91;</span><span style="color: #CC0000;">2</span><span style="color: #009900;">&#93;</span>.<span style="color: #660066;">firstElementChild</span>.<span style="color: #660066;">controls</span><span style="color: #339933;">=</span><span style="color: #CC0000;">1</span><span style="color: #339933;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #009900;">&#125;</span><span style="color: #339933;">,</span><span style="color: #CC0000;">1000</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></div></li>
</ol></div></div>
</div>

 <img src="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=533" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>https://tofu.im/blog/2010/05/21/webm-video/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>HTML5 Video</title>
		<link>https://tofu.im/blog/2010/04/06/html5-video/</link>
		<comments>https://tofu.im/blog/2010/04/06/html5-video/#comments</comments>
		<pubDate>Tue, 06 Apr 2010 13:45:46 +0000</pubDate>
		<dc:creator>Csineneo</dc:creator>
				<category><![CDATA[Opera]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[視頻]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Video]]></category>

		<guid isPermaLink="false">http://blog.csineneo.com/?p=431</guid>
		<description><![CDATA[高碼率，低帶寬極不流暢 =.=! 非常遺憾您的瀏覽器不支持 HTML5 Video Tag，建議您使用 Opera 瀏覽器訪問此頁面，點此下載 ogv 格式視頻]]></description>
			<content:encoded><![CDATA[<p>高碼率，低帶寬極不流暢 =.=!<br />
<video controls><source src="https://tofu.im/blog/video/wb.ogv" type="video/ogg" />非常遺憾您的瀏覽器不支持 HTML5 Video Tag，建議您使用 <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL29wZXJhLmNvbS8=">Opera 瀏覽器</a>訪問此頁面，<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cHM6Ly90b2Z1LmltL2Jsb2cvdmlkZW8vd2Iub2d2">點此下載 ogv 格式視頻</a></video></p>
 <img src="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=431" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>https://tofu.im/blog/2010/04/06/html5-video/feed/</wfw:commentRss>
		<slash:comments>11</slash:comments>
		</item>
		<item>
		<title>HTML5 Audio</title>
		<link>https://tofu.im/blog/2010/04/06/html5-audio/</link>
		<comments>https://tofu.im/blog/2010/04/06/html5-audio/#comments</comments>
		<pubDate>Tue, 06 Apr 2010 07:50:08 +0000</pubDate>
		<dc:creator>Csineneo</dc:creator>
				<category><![CDATA[Opera]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[音樂]]></category>
		<category><![CDATA[Audio]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://blog.csineneo.com/?p=407</guid>
		<description><![CDATA[何嘗不是今日之中國 =.=! 非常遺憾您的瀏覽器不支持 HTML5 Audio Tag，建議您使用 Opera 瀏覽器訪問此頁面，點此下載 ogg 格式音頻]]></description>
			<content:encoded><![CDATA[<p>何嘗不是今日之中國 =.=!</p>
<p><audio controls><source src="https://tofu.im/blog/audio/dgm.ogg" type="audio/ogg" />非常遺憾您的瀏覽器不支持 HTML5 Audio Tag，建議您使用 <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL29wZXJhLmNvbS8=">Opera 瀏覽器</a>訪問此頁面，<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cHM6Ly90b2Z1LmltL2Jsb2cvYXVkaW8vZGdtLm9nZw==">點此下載 ogg 格式音頻</a></audio></p>
 <img src="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=407" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>https://tofu.im/blog/2010/04/06/html5-audio/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>閑來無聊</title>
		<link>https://tofu.im/blog/2010/04/06/%e9%96%91%e4%be%86%e7%84%a1%e8%81%8a/</link>
		<comments>https://tofu.im/blog/2010/04/06/%e9%96%91%e4%be%86%e7%84%a1%e8%81%8a/#comments</comments>
		<pubDate>Mon, 05 Apr 2010 18:05:01 +0000</pubDate>
		<dc:creator>Csineneo</dc:creator>
				<category><![CDATA[Opera]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[碎語]]></category>
		<category><![CDATA[Software]]></category>
		<category><![CDATA[YouTube]]></category>

		<guid isPermaLink="false">http://blog.csineneo.com/?p=394</guid>
		<description><![CDATA[無聊之一： 10.5x 在 xp 下，如果窗口上覆蓋有其他窗口時滾動頁面會產生殘影，雖然同事已經修復了這個 bug，但是 oslo 那邊的 qa 還在測試，不曉得什麼時候能加進來，不爽啊，只好曲線救國一下 在 &#60;body> 後插入 &#60;div style=&#34;position: fixed&#34;&#62;.&#60;/div&#62; 使用絕對定位來迫使 Opera 在滾動時不斷重繪頁面，雖然不再殘影了，可惜滾動也不再平滑，更加不爽，只好作罷 =.=! 無聊之二： keepvid 新加了 Java Applet 來抓視頻地址，搞不懂有什麼好處，轉了半天也抓不到新版 youtube 的視頻地址 =.=! 閑著無事便寫了個腳本，自用簡陋版，測試 http://csineneo.com/flv/?id=H_mU7lkE-sA id 即為 youtube 視頻 id，適合加到 Opera 菜單中 :D 無聊之三： 即便是閑著也無法忍受 clipx 不能保存 snagit 截圖的問題了，換了 CLCL，這個小巧強大性能看起來也不錯的工具還是在 Lexi 的網站上看到的，這位老兄做了俄語版 =.=! CLCL 啊，你怎能如此強大，即便五年沒開發依然這般強悍 =.=!]]></description>
			<content:encoded><![CDATA[<p>無聊之一：<br />
10.5x 在 xp 下，如果窗口上覆蓋有其他窗口時滾動頁面會產生殘影，雖然同事已經修復了這個 bug，但是 oslo 那邊的 qa 還在測試，不曉得什麼時候能加進來，不爽啊，只好曲線救國一下<br />
在 &lt;body> 後插入</p>

<div class="bwp-syntax-block clearfix">
<div class="bwp-syntax-toolbar"></div>
<div class="bwp-syntax-wrapper clearfix bwp-syntax-advanced"><div class="html4strict"><ol><li style=""><div style=""><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">style</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;position: fixed&quot;</span>&gt;</span>.<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></li>
</ol></div></div>
</div>

<p>使用絕對定位來迫使 Opera 在滾動時不斷重繪頁面，雖然不再殘影了，可惜滾動也不再平滑，更加不爽，只好作罷 =.=!</p>
<p>無聊之二：<br />
<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL2tlZXB2aWQuY29tLw==">keepvid</a> 新加了 Java Applet 來抓視頻地址，搞不懂有什麼好處，轉了半天也抓不到新版 youtube 的視頻地址 =.=!<br />
閑著無事便寫了個腳本，自用簡陋版，測試 <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL2NzaW5lbmVvLmNvbS9mbHYvP2lkPUhfbVU3bGtFLXNB">http://csineneo.com/flv/?id=H_mU7lkE-sA</a><br />
id 即為 youtube 視頻 id，適合加到 Opera 菜單中 :D</p>
<p>無聊之三：<br />
即便是閑著也無法忍受 clipx 不能保存 snagit 截圖的問題了，換了 <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3d3dy5uYWtrYS5jb20vc29mdC9jbGNsL2luZGV4X2VuZy5odG1s">CLCL</a>，這個小巧強大性能看起來也不錯的工具還是在 <a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL2xleGkudWNvei5ydS8=">Lexi</a> 的網站上看到的，這位老兄做了俄語版 =.=!<br />
CLCL 啊，你怎能如此強大，即便五年沒開發依然這般強悍 =.=!</p>
 <img src="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=394" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>https://tofu.im/blog/2010/04/06/%e9%96%91%e4%be%86%e7%84%a1%e8%81%8a/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>太極</title>
		<link>https://tofu.im/blog/2010/04/03/%e5%a4%aa%e6%a5%b5/</link>
		<comments>https://tofu.im/blog/2010/04/03/%e5%a4%aa%e6%a5%b5/#comments</comments>
		<pubDate>Fri, 02 Apr 2010 18:18:57 +0000</pubDate>
		<dc:creator>Csineneo</dc:creator>
				<category><![CDATA[Opera]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[CSS3]]></category>

		<guid isPermaLink="false">http://blog.csineneo.com/?p=343</guid>
		<description><![CDATA[貓貓在用 border-radius 畫樹葉和貓頭，我也來畫個簡單的太極圖，仅支持 Opera 10.5x 及 Chrome 5 HTML: &#60;div id=&#34;fish&#34;&#62; &#160; &#160; &#60;div id=&#34;white_fish&#34;&#62; &#160; &#160; &#160; &#160; &#60;div id=&#34;black_fish&#34;&#62; &#160; &#160; &#160; &#160; &#160; &#160; &#60;div id=&#34;white_fish_head&#34;&#62; &#160; &#160; &#160; &#160; &#160; &#160; &#160; &#160; &#60;div id=&#34;black_fish_eye&#34;&#62;&#60;/div&#62; &#160; &#160; &#160; &#160; &#160; &#160; &#60;/div&#62; &#160; &#160; &#160; &#160; &#160; &#160; &#60;div id=&#34;black_fish_head&#34;&#62; &#160; [...]]]></description>
			<content:encoded><![CDATA[<p>貓貓在用 border-radius 畫樹葉和貓頭，我也來畫個簡單的<a href="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL2NzaW5lbmVvLmNvbS8=">太極圖</a>，仅支持 Opera 10.5x 及 Chrome 5</p>
<p>HTML:</p>

<div class="bwp-syntax-block clearfix">
<div class="bwp-syntax-toolbar"></div>
<div class="bwp-syntax-wrapper clearfix bwp-syntax-advanced"><div class="html4strict"><ol><li style=""><div style=""><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;fish&quot;</span>&gt;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;white_fish&quot;</span>&gt;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;black_fish&quot;</span>&gt;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;white_fish_head&quot;</span>&gt;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;black_fish_eye&quot;</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;black_fish_head&quot;</span>&gt;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;white_fish_eye&quot;</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></li>
</ol></div></div>
</div>

<p>CSS:</p>

<div class="bwp-syntax-block clearfix">
<div class="bwp-syntax-toolbar"></div>
<div class="bwp-syntax-wrapper clearfix bwp-syntax-advanced"><div class="css"><ol><li style=""><div style=""><span style="color: #cc00cc;">#fish</span> <span style="color: #00AA00;">&#123;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span> <span style="color: #933;">404px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span> <span style="color: #933;">404px</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">absolute</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">top</span><span style="color: #00AA00;">:</span> <span style="color: #933;">50%</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">:</span> <span style="color: #933;">50%</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">margin</span><span style="color: #00AA00;">:</span> <span style="color: #933;">-202px</span> <span style="color: #cc66cc;">0</span> <span style="color: #cc66cc;">0</span> <span style="color: #933;">-202px</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #00AA00;">&#125;</span></div></li>
<li style=""><div style="">&nbsp;</div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #cc00cc;">#white_fish</span><span style="color: #00AA00;">,</span> <span style="color: #cc00cc;">#white_fish_head</span><span style="color: #00AA00;">,</span> <span style="color: #cc00cc;">#white_fish_eye</span> <span style="color: #00AA00;">&#123;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#fff</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #00AA00;">&#125;</span></div></li>
<li style=""><div style="">&nbsp;</div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #cc00cc;">#black_fish</span><span style="color: #00AA00;">,</span> <span style="color: #cc00cc;">#black_fish_head</span><span style="color: #00AA00;">,</span> <span style="color: #cc00cc;">#black_fish_eye</span> <span style="color: #00AA00;">&#123;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#000</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #00AA00;">&#125;</span></div></li>
<li style=""><div style="">&nbsp;</div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #cc00cc;">#white_fish</span> <span style="color: #00AA00;">&#123;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span> <span style="color: #933;">400px</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span> <span style="color: #933;">400px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">border</span><span style="color: #00AA00;">:</span> <span style="color: #933;">1px</span> <span style="color: #993333;">solid</span> <span style="color: #cc00cc;">#000</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; border-radius<span style="color: #00AA00;">:</span> <span style="color: #933;">200px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style=""><span style="color: #00AA00;">&#125;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp;</div></li>
<li style=""><div style=""><span style="color: #cc00cc;">#black_fish</span> <span style="color: #00AA00;">&#123;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span> <span style="color: #933;">200px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span> <span style="color: #933;">400px</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; border-radius<span style="color: #00AA00;">:</span> <span style="color: #cc66cc;">0</span> <span style="color: #933;">200px</span> <span style="color: #933;">200px</span> <span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">relative</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">:</span> <span style="color: #933;">200px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style=""><span style="color: #00AA00;">&#125;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp;</div></li>
<li style=""><div style=""><span style="color: #cc00cc;">#white_fish_head</span><span style="color: #00AA00;">,</span> <span style="color: #cc00cc;">#black_fish_head</span> <span style="color: #00AA00;">&#123;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span> <span style="color: #933;">200px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span> <span style="color: #933;">200px</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; border-radius<span style="color: #00AA00;">:</span> <span style="color: #933;">200px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">relative</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">right</span><span style="color: #00AA00;">:</span> <span style="color: #933;">100px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style=""><span style="color: #00AA00;">&#125;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp;</div></li>
<li style=""><div style=""><span style="color: #cc00cc;">#white_fish_eye</span><span style="color: #00AA00;">,</span> <span style="color: #cc00cc;">#black_fish_eye</span> <span style="color: #00AA00;">&#123;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span> <span style="color: #933;">50px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span> <span style="color: #933;">50px</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; border-radius<span style="color: #00AA00;">:</span> <span style="color: #933;">50px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">relative</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">:</span> <span style="color: #933;">75px</span><span style="color: #00AA00;">;</span></div></li>
<li style=""><div style="">&nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">top</span><span style="color: #00AA00;">:</span> <span style="color: #933;">75px</span><span style="color: #00AA00;">;</span></div></li>
<li style="background-color: #f8f8f8;"><div style=""><span style="color: #00AA00;">&#125;</span></div></li>
</ol></div></div>
</div>

 <img src="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=343" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>https://tofu.im/blog/2010/04/03/%e5%a4%aa%e6%a5%b5/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Google App Proxy</title>
		<link>https://tofu.im/blog/2009/02/19/google-app-proxy/</link>
		<comments>https://tofu.im/blog/2009/02/19/google-app-proxy/#comments</comments>
		<pubDate>Thu, 19 Feb 2009 14:35:17 +0000</pubDate>
		<dc:creator>Csineneo</dc:creator>
				<category><![CDATA[WEB]]></category>
		<category><![CDATA[碎語]]></category>

		<guid isPermaLink="false">http://blog.csineneo.com/?p=219</guid>
		<description><![CDATA[今天回家以後 freegate 死活搜不到服務器，之前買的 hostmonster 空間也把我的代理撤下了，在一大局域網里真是會悶死人的 =.=! 研究了下 GAppProxy，申請了一個 GAE，上傳腳本，兩分鐘搞定一個代理服務器，真是快。 實際使用起來，那速度也是一個快字。 fetch server 地址如圖，有需要的拿去。]]></description>
			<content:encoded><![CDATA[<p>今天回家以後 freegate 死活搜不到服務器，之前買的 hostmonster 空間也把我的代理撤下了，在一大局域網里真是會悶死人的 =.=!<br />
研究了下 GAppProxy，申請了一個 GAE，上傳腳本，兩分鐘搞定一個代理服務器，真是快。<br />
實際使用起來，那速度也是一個快字。</p>
<p>fetch server 地址如圖，有需要的拿去。<br />
<img src="http://tofu.im/blog/files/2009/02/20090219_223228_csineneozion.png" alt="" title="20090219_223228_csineneozion" width="452" height="227" class="aligncenter size-full wp-image-220" /></p>
 <img src="https://tofu.im/blog/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=219" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>https://tofu.im/blog/2009/02/19/google-app-proxy/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

