讓你的thickbox的modal也擁有關閉圖示

Thickbox是一款很不錯的jquery彈出層的插件.關于他的細節用法,可以參考他的官方說明。最近一直在用這個插件，發現他的一個modal模式沒有右上側的關閉按鈕。于是我就随便弄了一個，有點賣巧。

效果圖如下：

<a target="_blank" href="http://blog.51cto.com/attachment/201105/131443132.png"></a>

 這樣就可以點選關閉圖示關閉modal視窗。

詳細代碼如下：

&lt;div id="login" style="text-align: center"&gt; 

&lt;div style="position:absolute; right:0; top:0"&gt;&lt;img src="images/closebox.png" onclick="parent.tb_remove()" alt="點選關閉" style="cursor:pointer" /&gt;&lt;/div&gt; 

&lt;table border="0" cellpadding="3" cellspacing="3" style="margin: 0 auto;"&gt; 

&lt;tr&gt; 

&lt;td style="text-align: right; padding: 10px"&gt; 

&lt;label&gt; 

使用者：&lt;/label&gt; 

&lt;/td&gt; 

&lt;td&gt; 

&lt;input id="username" type="text" size="20" /&gt; 

&lt;/tr&gt; 

密碼:&lt;/label&gt; 

&lt;input id="password" type="password" size="20" /&gt; 

&lt;tr align="right"&gt; 

&lt;td colspan="2"&gt; 

&lt;input type="submit" id="Login" value="  登 錄  " style="margin-right: 50px"&gt;   

&lt;input type="submit" id="LoginCancel" value="  取 消  " onclick="parent.tb_remove()"&gt; 

&lt;/table&gt; 

&lt;/div&gt; 

    本文轉自xshf12345 51CTO部落格，原文連結：http://blog.51cto.com/alexis/573358，如需轉載請自行聯系原作者