修改 IE 瀏覽器在 image map 時, 不顯示外框的方法

在使用 map 的 tag 時, IE 瀏覽器會在mouse click 時顯示一個很醜的 area 外框, 醜醜的外框長的像下面醬子:



解決方式: 在 img tag 裡增加 hidefocus="true" 的屬性即可.

特別感謝: 玟瑜 告訴我這個方法.

[IIS]. css 的 MIME type 會造成 firefox + chrome 顯示錯誤

畫面1: 左邊跑版, 右邊是 Error Message.



畫面2: 要設定一下 iis, 的設定, 不知道是那一個豬頭把 .* 給加上去, 氣死我了!

asp 實作 base64 加/解密

┏┓
┗■━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　┃ 1. Base64 定義
　┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Base64是一種使用64基的位置計數法。它使用2的最大次方來代表僅可打印的ASCII 字符。這使它可用來作為電子郵件的傳輸編碼。在Base64中的變量使用字符A-Z、a-z和0-9 ，這樣共有62個字符，用來作為開始的64個數字，最後兩個用來作為數字的符號在不同的系統中而不同。一些如uuencode的其他編碼方法，和之後binhex的版本使用不同的64字符集來代表6個二進制數字，但是它們不叫Base64。


┏┓
┗■━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　┃ 2. 執行結果
　┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━



┏┓
┗■━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　┃ 3. 程式碼
　┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━



┏┓
┗■━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　┃ 4. 心得
　┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
base64 的好處就是可以把原本用數字 0~255 來表示的字元, 改成用 0~63 來表示, 好處是資料可以放在URL裡被傳遞, 也可以避免掉部份 cross site script 的問題.

下圖是我被植入 script site script 的結果, 因為把字串放到 value="" 屬性裡, 因為變數內容有雙引號, 所以字串就跳脫了.



┏┓
┗■━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　┃ 5. 資料來源
　┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
將UTF-8編碼的字串轉成base64編碼
http://achtung.webhop.net/allenj/?p=628

研究 jQuery 輪播(轉場) 特效

1.InnerFade 範例 下載
http://medienfreunde.com/lab/innerfade/jquery.innerfade.zip
InnerFade 提供了三種輪播效果，我們可以在 index.htm 調整它的顯示速度及相關參數：

1. News輪播
$('#news').innerfade({
animationtype: 'slide',
speed: 750,
timeout: 2000,
type: 'random',
containerheight: '1em'
});


2. 圖片輪播
$('ul#portfolio').innerfade({
speed: 1000,
timeout: 5000,
type: 'sequence',
containerheight: '220px'
});


3. 段落輪播
$('.fade').innerfade({
speed: 1000,
timeout: 6000,
type: 'random_start',
containerheight: '1.5em'
});


修改要輪播的資料:

1. News輪播
<ul id="news">
<li>
<a href="#n1">1 Lorem ipsum dolor</a>
</li>
<li>
<a href="#n2">2 Sit amet, consectetuer</a>
</li>
...
...
</ul>

2. 圖片輪播
<ul id="portfolio">
<li>
<a href="http://medienfreunde.com/deutsch/referenzen/kreation/good_guy__bad_guy.html"><img src="images/ggbg.gif" alt="Good Guy bad Guy" /></a>
</li>
...
...
</ul>

3. 段落輪播
<div class="fade">
<p> 段落 1 </p>
<p> 段落 2 </p>
...
...
</div>


資料來源:
http://www.xt-commerce.cn/forum/archive/index.php/t-83.html


相關網站:
SmallSlider圖片輪播插件
http://www.d2nb.com/smallslider/index.html

我的第2個 javascript Object 程式, 實作 jQuery 的 Fade 特效

第1個 javascript 實在 object 的是 swfupload
下載 URL:
https://sites.google.com/site/max32002/webapp/swfUpload_%E5%A4%9A%E6%AA%94%E4%B8%8A%E5%82%B3_20110309.zip?attredirects=0&d=1

第2個實作的 javascript object 是 maxFadeObj,
下載 URL:
https://sites.google.com/site/max32002/webapp/gallery.20110329.zip?attredirects=0&d=1

心得:
1. 原來要用 jQuery 要做出特效還滿簡單的.
2. javascript 裡寫 settings 和 object 會比較好在其他的情況下做修改, 比較好移植(重覆利用), 比較容易了解, 比較方便做修改. 缺點, 寫出第1個object 需要多一點時間.


setting 的寫法:
2. 圖片輪播
$('ul#portfolio').innerfade({
speed: 1000,
timeout: 5000,
type: 'sequence',
containerheight: '220px'
});
再配合 extend() 來補齊不足的參數.


資料來源:
http://www.xt-commerce.cn/forum/archive/index.php/t-83.html


相關網站:
SmallSlider圖片輪播插件
http://www.d2nb.com/smallslider/index.html

除錯 flash 花了3小時

接到一個 flash 廣告輪播要內容要調整需求.

因為, 太有自信, 所以先用猜的, 以為只是小問題, 所以直接發佈到正式的環境做測試, 為了避免 browser cache swf 檔. 所以先清除掉 快取的暫存檔. 為了看 flash 取得及送出的 xml 檔正不正確, 再執行 fiddler2 來 debug. 每修改一次, 測試一次需要花5分~7分鐘.

東猜猜, 西猜猜, 都找不到實際的錯誤在那裡, 也改寫了很多地方的程式, 也都猜錯, 找不到實際出的錯誤在那裡, 最後就用正規的做法, 結果一下子就找到問題:
1. 先用假資料(實際的xml檔) 來取代從網路即時取得 xml.
2. 在程式碼裡, 加入 trace() 來輸出 debug 的資訊,

發現應該要被觸發事件的button 沒被觸發, 原來是有一個透明的圖層也被加入了 on(release) 事件, 上層的圖層的 on(release) 被執行, 被壓在下面的button 的 on(release) 就不會被執行. 移掉透明圖層裡的事件後, button 就變正常了.

用svn exprot 出貸時產生的錯誤來學習svn commit怎麼使用

畫面1: 裝機後的錯誤畫面.



trace 程式碼之後才發現是有少檔案,為什麼會少檔案呢?
原來是使用 svn 的 export, 沒有把所有的檔案都匯出來.
正確的 commit 方式, 請勾選 "show unversioned file"