2013年9月27日 星期五

用ThickBox 3.1秀出類似facebook的網頁效果

官方網站
http://jquery.com/demo/thickbox/
中文教學網
http://www.hsiu28.net/html/jss.php?id=19
下載JS、CSS與圖檔等檔案
延伸:
1.該元件在使用時常常都是要給予固定高、寬,但不同USER解析度時可能就會產生顯示問題
<a href="ajax.PHP?keepThis=true&TB_iframe=true&height=250&width=400" title="add a caption to title attribute / or leave blank" class="thickbox">Example 1</a>  
這時打開thickbox.js,大約187行左右有一段
TB_WIDTH = (params['width']*1) + 30 || 630
TB_HEIGHT = (params['height']*1) + 40 || 440
把它改成
TB_WIDTH = (params['width']*1) + 30 || screen.width*0.8
TB_HEIGHT = (params['height']*1) + 40 || screen.height*0.6

這樣傳入的參數如height=80%&width=60%,只要是非數值就會去偵測USER螢幕解析度百分比囉