<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/main.xsl"?>
<b:blog xmlns="http://www.w3.org/1999/xhtml" xmlns:b="http://blog.othree.net"  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://blog.othree.net http://blog.othree.net/blooog.xsd">
	<b:blogTitle>O3noBLOG</b:blogTitle>
	<b:blogDescription></b:blogDescription>
	<b:entries>
		<b:entriesMeta>
			<b:listType>m</b:listType>
			<b:listData listID="2008-01">January 2008</b:listData>

			<b:previous>
				<b:mTitle>December 2007</b:mTitle>
				<b:mDate>2007/12</b:mDate>
			</b:previous>


			<b:next>
				<b:mTitle>February 2008</b:mTitle>
				<b:mDate>2008/02</b:mDate>				
			</b:next>

		</b:entriesMeta>

		<b:entry entryID="000487" baseName="w3c-publish-html-5-wd">
			<b:author>
				<b:authorName>othree</b:authorName>
				<b:authorEmail>othree@gmail.com</b:authorEmail>
				<b:authorUrl></b:authorUrl>
			</b:author>
			<b:datetime>
				<b:date>2008-01-23</b:date>
				<b:time>01:59:14</b:time>
			</b:datetime>
			<b:category>css-html</b:category>
			<b:title>W3C發佈HTML 5 Working Draft</b:title>
			<b:content>
				<b:summary>W3C剛發佈的HTML 5 Working Draft，正熱，不過太晚了，我已經沒力看改了什麼東西，明天醒來應該也可以看到不少評論了吧。 不過我其實還是快速看過目錄，nl(navigation list)和h(heading)好像不見了。...</b:summary>
				<b:mainContent><p><span class="caps">W3C</span>剛發佈的<a href="http://www.w3.org/TR/2008/WD-html5-20080122/"><span class="caps">HTML</span> 5 Working Draft</a>，正熱，不過太晚了，我已經沒力看改了什麼東西，明天醒來應該也可以看到不少評論了吧。</p>

<p>不過我其實還是快速看過目錄，nl(navigation list)和h(heading)好像不見了。</p></b:mainContent>
				<b:extendContent></b:extendContent>
			</b:content>

			<b:comments commentCount="0"></b:comments>


			<b:trackbacks trackbackCount="0"></b:trackbacks>

		</b:entry>

		<b:entry entryID="000486" baseName="gvim-setting-complete">
			<b:author>
				<b:authorName>othree</b:authorName>
				<b:authorEmail>othree@gmail.com</b:authorEmail>
				<b:authorUrl></b:authorUrl>
			</b:author>
			<b:datetime>
				<b:date>2008-01-23</b:date>
				<b:time>01:05:07</b:time>
			</b:datetime>
			<b:category>vim</b:category>
			<b:title>gVim設定完成</b:title>
			<b:content>
				<b:summary>最近幾天都在調整家裏和學校電腦的gVim設定，離上次在Windows上用Vim已經好一陣子了，這段時間都是用MadEdit來做為主要的編輯器，不過MadEdit對我來說還有幾個缺點，第一是同時開太多檔案會出錯，第二是預設背景色是白的，要整個重新設定很麻煩，所以最近又重新把Vim裝起來，調整他的設定檔，現在已經調到差不多了，其實還有一些目標想達成，不過還不算必要，而且還找不太到資料，所以就先暫緩。這次我是使用Cornelius的Enhanced Vim Package for Windows為基礎，多加入我之前的一些設定和這次找到的新設定，最後挑了一組還不錯的顏色，然後簡單修改一下，中間比較辛苦的是在字型設定的部份，還好Tiberius剛好發表了程設字型新歡 Inconsolata這篇文章，剛好切中我的問題所在，真是如有神助XD。 在功能的加強上，我找到讓Omni Auto Completion變得更簡單的方法了，之前也說過要Ctrl+x, Ctrl+n兩次組合鍵實在很麻煩，沒想到我在網路上搜尋的過程中，意外發現到這個設定檔，節錄自動完成的部份過來如下： &quot; Omni補完関連 &quot; $VIMRUNTIME/autoload/htmlcomplete.vimの645行目をコメントアウントしておくとhtmlの補完が小文字になる set completeopt=menu,preview,menuone &quot; 補完表示設定 &quot; TabでOmni補完及びポップアップメニューの選択 function InsertTabWrapper(is_shift) if pumvisible() return a:is_shift ? &quot;\&lt;C-p&gt;&quot; : &quot;\&lt;C-n&gt;&quot; endif let col = col('.') - 1 if !col ||...</b:summary>
				<b:mainContent><p>最近幾天都在調整家裏和學校電腦的gVim設定，離上次在Windows上用Vim已經好一陣子了，這段時間都是用<a href="http://madedit.sourceforge.net/">MadEdit</a>來做為主要的編輯器，不過MadEdit對我來說還有幾個缺點，第一是同時開太多檔案會出錯，第二是預設背景色是白的，要整個重新設定很麻煩，所以最近又重新把Vim裝起來，調整他的設定檔，現在已經調到差不多了，其實還有一些目標想達成，不過還不算必要，而且還找不太到資料，所以就先暫緩。這次我是使用Cornelius的<a href="http://c9s.blogspot.com/2007/09/enhanced-gvim-package-for-win32.html">Enhanced Vim Package for Windows</a>為基礎，多加入我之前的一些設定和這次找到的新設定，最後挑了一組還不錯的顏色，然後簡單修改一下，中間比較辛苦的是在字型設定的部份，還好Tiberius剛好發表了<a href="http://sbt.idv.tw/blog/tiberius/2008/01/21/793">程設字型新歡 Inconsolata</a>這篇文章，剛好切中我的問題所在，真是如有神助XD。</p>

<p>在功能的加強上，我找到讓Omni Auto Completion變得更簡單的方法了，之前也說過要Ctrl+x, Ctrl+n兩次組合鍵實在很麻煩，沒想到我在網路上搜尋的過程中，意外發現到<a href="http://relaxedcolumn.blog8.fc2.com/blog-entry-101.html">這個設定檔</a>，節錄自動完成的部份過來如下：</p><pre><code>&quot; Omni補完関連
&quot; $VIMRUNTIME/autoload/htmlcomplete.vimの645行目をコメントアウントしておくとhtmlの補完が小文字になる

set completeopt=menu,preview,menuone &quot; 補完表示設定

&quot; TabでOmni補完及びポップアップメニューの選択
function InsertTabWrapper(is_shift)
    if pumvisible()
        return a:is_shift ? &quot;\&lt;C-p&gt;&quot; : &quot;\&lt;C-n&gt;&quot;
    endif
    let col = col('.') - 1
    if !col || getline('.')[col - 1] !~ '\k\|&lt;\|/' &quot; htmlで補完できるように&lt;,/でもOmni補完
        return &quot;\&lt;tab&gt;&quot;
    elseif exists('&amp;omnifunc') &amp;&amp; &amp;omnifunc == ''
        return a:is_shift ? &quot;\&lt;C-p&gt;&quot; : &quot;\&lt;C-n&gt;&quot;
    else
        return &quot;\&lt;C-x&gt;\&lt;C-o&gt;&quot;
    endif
endfunction
inoremap &lt;tab&gt; &lt;C-r&gt;=InsertTabWrapper(0)&lt;CR&gt;
&quot; Shift-Tabはうまくいかないようだ
&quot; inoremap &lt;S-tab&gt; &lt;C-r&gt;=InsertTabWrapper(1)&lt;CR&gt;

&quot; CRでOmni確定&amp;改行
function InsertCrWrapper()
    return pumvisible() ? &quot;\&lt;C-y&gt;\&lt;CR&gt;&quot; : &quot;\&lt;CR&gt;&quot;
endfunction
inoremap &lt;CR&gt; &lt;C-r&gt;=InsertCrWrapper()&lt;CR&gt;</code></pre><p>這個設定可以使用Tab鍵來進行自動完成，如果只是直接想要輸入tab，那也可以輸入shift+tab，實際用起來真是想像以上的方便。不過Tab鍵在原來的Enhanced Vim中已經先指派給Snippets了，我是把這部份設定mark起來。</p>

<p><a href="http://www.flickr.com/photos/othree/2209556530/" title="Flickr 上 othree 的 工作環境設定中"><img src="http://farm3.static.flickr.com/2263/2209556530_1039643691.jpg" width="500" height="366" alt="工作環境設定中" /></a></p></b:mainContent>
				<b:extendContent></b:extendContent>
			</b:content>

			<b:comments commentCount="0"></b:comments>


			<b:trackbacks trackbackCount="0"></b:trackbacks>

		</b:entry>

		<b:entry entryID="000485" baseName="parts-of-uri">
			<b:author>
				<b:authorName>othree</b:authorName>
				<b:authorEmail>othree@gmail.com</b:authorEmail>
				<b:authorUrl></b:authorUrl>
			</b:author>
			<b:datetime>
				<b:date>2008-01-18</b:date>
				<b:time>13:37:16</b:time>
			</b:datetime>
			<b:category>web</b:category>
			<b:title>網址各部份名稱</b:title>
			<b:content>
				<b:summary>剛剛寫文章時需要用到去查了一下，URI語法是在RFC STD66這個標準裡制定的，各部份名稱範例如下： 以前都沒注意到parameter這部份，反而認為是parameter的其實是叫query。 Wikipedia URI Scheme STD66...</b:summary>
				<b:mainContent><p>剛剛寫文章時需要用到去查了一下，URI語法是在<a href="http://rfc.net/std0066.html"><span class="caps">RFC STD66</span></a>這個標準裡制定的，各部份名稱範例如下：</p>

<p><a href="http://blog.othree.net/log/2008/01/18/parts-of-uri/uri.gif" class="thickbox"><img src="http://blog.othree.net/log/2008/01/18/parts-of-uri/uri-thumb-400x76.gif" alt="" height="76" width="400" /></a></p>


<p>以前都沒注意到parameter這部份，反而認為是parameter的其實是叫query。</p>


<ul>
<li><a href="http://en.wikipedia.org/wiki/URI_scheme">Wikipedia <span class="caps">URI</span> Scheme</a></li>
<li><a href="http://rfc.net/std0066.html"><span class="caps">STD66</span></a></li>
</ul>

</b:mainContent>
				<b:extendContent></b:extendContent>
			</b:content>

			<b:comments commentCount="0"></b:comments>


			<b:trackbacks trackbackCount="0"></b:trackbacks>

		</b:entry>

		<b:entry entryID="000484" baseName="move-smoothly-2">
			<b:author>
				<b:authorName>othree</b:authorName>
				<b:authorEmail>othree@gmail.com</b:authorEmail>
				<b:authorUrl></b:authorUrl>
			</b:author>
			<b:datetime>
				<b:date>2008-01-18</b:date>
				<b:time>01:41:27</b:time>
			</b:datetime>
			<b:category>script</b:category>
			<b:title>讓你的特效更平順之二</b:title>
			<b:content>
				<b:summary>之前我曾經發表過一篇如何讓你的特效更平順，那時候用的方法是每次function內檢查時間變化，然後決定這時候應該在哪個位置，那時候這方法效果大概已經不錯了，不過我這兩天看Pro JavaScript Techniques，裡面的範例使用的方法看起來會更順暢，他的原理是一開始就把每個時間點要做的動作一口氣設定好，接下來就沒有interval的問題，也不用檢查時間變化，當然也不會有配合setTimeout使用遞迴時的延遲問題，重點部份範例如下： for ( var i = 0; i &lt;= 100; i += 5 ) { (function () { var pos = i; setTimeout(function () { elem.style.height = ( ( pos / 100) * h ) + &quot;px&quot;; },...</b:summary>
				<b:mainContent><p>之前我曾經發表過一篇<a href="http://blog.othree.net/log/2005/09/26/move-smoothly/">如何讓你的特效更平順</a>，那時候用的方法是每次function內檢查時間變化，然後決定這時候應該在哪個位置，那時候這方法效果大概已經不錯了，不過我這兩天看Pro JavaScript Techniques，裡面的範例使用的方法看起來會更順暢，他的原理是一開始就把每個時間點要做的動作一口氣設定好，接下來就沒有interval的問題，也不用檢查時間變化，當然也不會有配合setTimeout使用遞迴時的延遲問題，重點部份範例如下：</p><pre><code>for ( var i = 0; i &lt;= 100; i += 5 ) {
    (function () {
        var pos = i;
        setTimeout(function () {
            elem.style.height = ( ( pos / 100) * h ) + &quot;px&quot;;
        }, ( pos +1 ) * 10 );
    })();
}</code></pre><p>這是一個slide down的效果，直接設定好分21次調整元素高度，每次間隔50微秒，這樣子就可以產生順暢的動畫效果了。</p></b:mainContent>
				<b:extendContent></b:extendContent>
			</b:content>

			<b:comments commentCount="0"></b:comments>


			<b:trackbacks trackbackCount="0"></b:trackbacks>

		</b:entry>

		<b:entry entryID="000483" baseName="eric-meyer-renew-style-reset">
			<b:author>
				<b:authorName>othree</b:authorName>
				<b:authorEmail>othree@gmail.com</b:authorEmail>
				<b:authorUrl></b:authorUrl>
			</b:author>
			<b:datetime>
				<b:date>2008-01-17</b:date>
				<b:time>23:39:25</b:time>
			</b:datetime>
			<b:category>css-html</b:category>
			<b:title>Eric Meyer 更新 style resetting</b:title>
			<b:content>
				<b:summary>在Resetting Again這篇文章中，Eric Meyer更新了好幾個月沒修改過的style resetting（好像一直沒正式的名稱），真的改的地方其實不多，主要的修改是原來是設定為繼承的幾個地方，其他還有一些小變動，以下是完整code： html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong,...</b:summary>
				<b:mainContent><p>在<a href="http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/">Resetting Again</a>這篇文章中，Eric Meyer更新了好幾個月沒修改過的style resetting（好像一直沒正式的名稱），真的改的地方其實不多，主要的修改是原來是設定為<strong>繼承</strong>的幾個地方，其他還有一些小變動，以下是完整code：</p><pre><code>html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing=&quot;0&quot;' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}</code></pre><h4>給不知道這是什麼的人</h4>

<p>這段CSS是用來把各種瀏覽器的預設樣式覆蓋掉，把整個網頁變成沒有樣式的狀態，h1、h2、p等標籤都會是一樣大小的字體、字集，使用方法就是在任何你自己的CSS之前先在網頁上套用這段CSS。</p></b:mainContent>
				<b:extendContent></b:extendContent>
			</b:content>

			<b:comments commentCount="0"></b:comments>


			<b:trackbacks trackbackCount="0"></b:trackbacks>

		</b:entry>

		<b:entry entryID="000482" baseName="ie7-20-beta">
			<b:author>
				<b:authorName>othree</b:authorName>
				<b:authorEmail>othree@gmail.com</b:authorEmail>
				<b:authorUrl></b:authorUrl>
			</b:author>
			<b:datetime>
				<b:date>2008-01-09</b:date>
				<b:time>15:39:50</b:time>
			</b:datetime>
			<b:category>script</b:category>
			<b:title>IE7 2.0</b:title>
			<b:content>
				<b:summary>IE7前陣子推出了新版了，這次變成有兩個js檔案，IE7.js和IE8.js，我一開始還以為IE7.js是加強Internet Explorer 7 的功能，然後就在想IE8.js是幹麻用的，結果其實IE7.js是補強Internet Explorer 5.5和6.0用的檔案，IE8.js則是提供一些Internet Explorer 7也還沒實作的功能，大部分是CSS相關的，詳細的功能清單可以在Demo頁面看到，其中我比較注意到的是min-height和max-height似乎也成功弄好了，這可是之前唯一被標上沒辦法做到的項目啊。另外半透明png則變成只會對檔名是-trans.png結尾的才會修正，還可以直接連接google code上的檔案，更新點不少。 而分成兩個檔案的好處是可以使用condition commet把不同版本的Internet Explorer分開，Internet Explorer 7就不需要去讀取IE7.js，只執行他需要的部份，而且程式排除一些很少用到的功能後變得更小，加上換了新的query engine，整體的速度應該提昇了不少，不過我還沒針對這點測試過，之前有在使用的可以更新看看。...</b:summary>
				<b:mainContent><p><a href="http://dean.edwards.name/weblog/2008/01/ie7-2/"><span class="caps">IE7</span></a>前陣子推出了新版了，這次變成有兩個js檔案，<strong><span class="caps">IE7.</span>js</strong>和<strong><span class="caps">IE8.</span>js</strong>，我一開始還以為IE7.js是加強Internet Explorer 7 的功能，然後就在想IE8.js是幹麻用的，結果其實IE7.js是補強Internet Explorer 5.5和6.0用的檔案，IE8.js則是提供一些Internet Explorer 7也還沒實作的功能，大部分是CSS相關的，詳細的功能清單可以在<a href="http://ie7-js.googlecode.com/svn/test/index.html">Demo頁面</a>看到，其中我比較注意到的是min-height和max-height似乎也成功弄好了，這可是之前唯一被標上沒辦法做到的項目啊。另外半透明png則變成只會對檔名是<strong>-trans.png</strong>結尾的才會修正，還可以直接連接google code上的檔案，更新點不少。</p>

<p>而分成兩個檔案的好處是可以使用condition commet把不同版本的Internet Explorer分開，Internet Explorer 7就不需要去讀取IE7.js，只執行他需要的部份，而且程式排除一些很少用到的功能後變得更小，加上換了新的query engine，整體的速度應該提昇了不少，不過我還沒針對這點測試過，之前有在使用的可以更新看看。</p></b:mainContent>
				<b:extendContent></b:extendContent>
			</b:content>

			<b:comments commentCount="0"></b:comments>


			<b:trackbacks trackbackCount="0"></b:trackbacks>

		</b:entry>

	</b:entries>
</b:blog>
