中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx

描述:

這是ThickBox的一個(gè)簡(jiǎn)單實(shí)例，這個(gè)例子展示了在中放置一張圖片（請(qǐng)看演示）。

說(shuō)明:
  • 創(chuàng)建一個(gè)link元素 (<a href>)
  • 給創(chuàng)建的這個(gè)link元素一個(gè)class屬性，其值是：thickbox (class="thickbox")
  • 在href屬性中指定一個(gè)張圖片地址(.jpg .jpeg .png .gif .bmp)
點(diǎn)擊圖片查看效果:

Image 2

<a href="Upimg/single.jpg" title="add a caption to title attribute / or leave blank" class="thickbox"><img src="Upimg/single_t.jpg" alt="Single Image"/></a>
描述:

這個(gè)例子和單張圖片差不多，但他允許使用rel屬性使多張圖片成為一組，在ThickBox里導(dǎo)航。這種完美的使用方法適用于圖片集。

使用說(shuō)明:
  • 創(chuàng)建一個(gè)link元素 (<a href>)
  • 給創(chuàng)建的這個(gè)link元素一個(gè)class屬性，其值是：thickbox; (class="thickbox")
  • 在href屬性中指定一個(gè)張圖片地址 (.jpg .jpeg .png .gif .bmp)
  • 給每一個(gè)link元素一個(gè)相同的rel值。（比如：rel="gallery-plants"）
重點(diǎn)提醒:

當(dāng)你打開(kāi)一個(gè)ThickBox圖片集的時(shí)候, 你能通過(guò)鍵盤(pán)的左右箭頭鍵向前和向前和向后導(dǎo)航（在 ThickBox 里也提供了Next和Previous的鏈接）。 圖片將會(huì)在圖片集中按HTML文檔流程從第一張顯示到最后一張。

點(diǎn)擊一張圖片:

Plant 1   Plant 2   Plant 3   Plant 4 

<a href="Upimg/plant1.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="Upimg/plant1_t.jpg" alt="Plant 1" /></a> 
<a href="Upimg/plant2.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="Upimg/plant2_t.jpg" alt="Plant 2" /></a> 
<a href="Upimg/plant3.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="Upimg/plant3_t.jpg" alt="Plant 3" /></a> 
<a href="Upimg/plant4.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="Upimg/plant4_t.jpg" alt="Plant 4" /></a>
描述:

頁(yè)面中的內(nèi)嵌內(nèi)容，隱藏的或是顯示的均可以放置在ThickBox中。

使用說(shuō)明:
  • 創(chuàng)建一個(gè)link元素(<a href>)
  • 給創(chuàng)建的這個(gè)link元素一個(gè)class屬性，其值是：thickbox (class="thickbox")
  • 給link元素的href屬性設(shè)置為: #TB_inline
  • 在href屬性的值#TB_inlineIn后面追加一下字符: 
    ?height=300&width=300&inlineId=myOnPageContent
  • 根據(jù)你的實(shí)際需要更改height, width, 和 inlineId的值（這里的inlineID就是包含你想顯示在ThickBox上的內(nèi)容的容器的id）。
  • 當(dāng)然你也可以在參數(shù)字符串中加 modal=true(比如. #TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true) 這樣當(dāng)關(guān)閉ThickBox時(shí)會(huì)調(diào)用ThickBox內(nèi)部的一個(gè)tb_remove()函數(shù)。在演示中查看“顯示隱藏模式的內(nèi)容”則要求點(diǎn)擊yes 或 no才能關(guān)閉ThickBox。
重點(diǎn)提醒:

如果內(nèi)嵌在ThickBox的內(nèi)容多于ThickBox顯示的尺寸，一個(gè)滾動(dòng)條會(huì)出現(xiàn)。請(qǐng)確認(rèn)ThickBox的尺寸和內(nèi)容的匹配避免出現(xiàn)滾動(dòng)條而顯示全部?jī)?nèi)嵌內(nèi)容。也就是說(shuō)，如果不想要滾動(dòng)條，你可以增加ThickBox的寬和高直到內(nèi)嵌的內(nèi)容不需要滾動(dòng)條就能全部顯示。

點(diǎn)擊“顯示”按鈕后，將在中看到下面的一段文字以及那個(gè)寫(xiě)了”測(cè)試“的input，或是點(diǎn)擊顯示隱藏模式的內(nèi)容 則顯示在本文檔中隱藏起來(lái)id為“hiddenModalContent”的div內(nèi)的內(nèi)容

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

<input alt="#TB_inline?height=300&width=400&inlineId=myOnPageContent" title="add a caption to title attribute / or leave blank" class="thickbox" type="button" value="Show" />  
<a href="#TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true" class="thickbox">Show hidden modal content.</a>
描述:

在ThickBox中打開(kāi)被 iFramed URL.哈, 這正 Greybox的功能. Opens URL's in an iframe inside of ThickBox. Yes, this is Greybox functionality.

使用說(shuō)明:
  • 創(chuàng)建一個(gè)link元素 (<a href>)
  • 給創(chuàng)建的這個(gè)link元素一個(gè)class屬性，其值是：thickbox (class="thickbox")
  • 給link元素的href屬性指向一個(gè)你希望在ThickBox顯示的URL。
  • href屬性的URL后面追加上以下字符參數(shù)： 
    ?KeepThis=true&TB_iframe=true&height=400&width=600
  • 根據(jù)你的實(shí)際需要改變上面的參數(shù)字符。
  • 當(dāng)然你也可以在參數(shù)字符串中加 modal=true
    (比如：?KeepThis=true&TB_iframe=true&height=400&width=600&modal=true) 這樣當(dāng)關(guān)閉ThickBox時(shí)會(huì)調(diào)用ThickBox iframe (self.parent.tb_remove())內(nèi)部的一個(gè)tb_remove()函數(shù)。在演示中查看“打開(kāi)iFrame Modal的演示”則要求點(diǎn)擊ok才能關(guān)閉ThickBox。
重點(diǎn)提醒:

所有其他參數(shù)字符都必須在TB_iframe 參數(shù)之前。URL中所有"TB" 之后的將被移除。

<a href="Upimg/ajax_ifram.html?keepThis=true&TB_iframe=true&height=250&width=400" title="add a caption to title attribute / or leave blank" class="thickbox">例子1</a>  
<a href="Upimg/ajaxOverFlow.html?keepThis=true&TB_iframe=true&height=300&width=500" title="add a caption to title attribute / or leave blank" class="thickbox">例子2</a>
<a href="iframeModal.html?placeValuesBeforeTB_=savedValues&TB_iframe=true&height=200&width=300&modal=true" title="add a caption to title attribute / or leave blank" class="thickbox">iFrame Modal被打開(kāi)的演示</a>
描述:

采用一個(gè)隱藏的HTTP request (AJAX) 從同一個(gè)服務(wù)器上獲取文件，并使用顯示其內(nèi)容。

使用說(shuō)明:
  • 創(chuàng)建一個(gè)link元素 (<a href>)
  • 給創(chuàng)建的這個(gè)link元素一個(gè)class屬性，其值是：thickbox (class="thickbox")
  • 給link元素的href屬性指向一個(gè)鏈接文件或是服務(wù)器目錄。(href="ajaxLogin.htm")
  • 在href屬性的URL后面追加以下字符來(lái)結(jié)束URL: 
    ?height=300&width=300
  • 根據(jù)需要更改寬和高的值。
  • 當(dāng)然，你也可以在上面的參數(shù)字符串再加上modal=true(比如. ?height=300&width=300&modal=true) 這樣當(dāng)關(guān)閉ThickBox時(shí)會(huì)調(diào)用ThickBox內(nèi)部的一個(gè)tb_remove()函數(shù)。在演示中查看“l(fā)ogin”這個(gè)例子則要求點(diǎn)擊yes 或 no才能關(guān)閉ThickBox。
重點(diǎn)提醒:

為了在新打開(kāi)的Ajax ThickBox中打開(kāi)新的Ajax內(nèi)容，他的代碼必須包含適當(dāng)?shù)?HTML (class=""thickbox) 來(lái)加載一個(gè)Ajax ThickBox (請(qǐng)留意演示例子)。其他唯一需要注意的一個(gè)地方就是調(diào)用的ThickBox必須包含寬和高，如果你給這兩項(xiàng)留空，則窗口會(huì)自適應(yīng)到默認(rèn)大?。?30*440）.

<a href="Upimg/ajaxOverFlow.html?height=300&width=300" title="add a caption to title attribute / or leave blank" class="thickbox">有滾動(dòng)條的內(nèi)容</a>  
<a href="Upimg/ajax.html?height=220&width=400" class="thickbox" title="add a caption to title attribute / or leave blank">沒(méi)滾動(dòng)條的內(nèi)容</a>  
<a href="Upimg/ajaxLogin.html?height=85&width=250&modal=true" class="thickbox" title="Please Sign In">登入(模式)</a>  
<a href="Upimg/ajaxTBcontent.html?height=200&width=300" class="thickbox" title="">更新ThickBox內(nèi)容</a>
點(diǎn)擊這里查看原版英文,由legal翻譯,翻得不好多多原諒.
主要目的除了方便自己使用,也可以和大家分享下.關(guān)鍵是訪問(wèn)國(guó)外網(wǎng)站N慢.這樣后大家看著也舒服.訪問(wèn)我的博客
本文版權(quán)歸Cody Lindley 所有
PS:thickbox是由 Cody Lindley開(kāi)發(fā)的一個(gè)jQuery插件。本thickbox3.1實(shí)例 updated on 08/08/2007