📄 try.php
字号:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="Description" content="ThickBox is a webpage UI dialog widget written in javascript on top of the jQuery library. It's function is too show a single image, multiple images, inline content, iframed content, and content served through AJAX in a hybrid modal." />
<meta name="author" content="Cody Lindley" />
<meta name="robots" content="all" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<meta http-equiv="imagetoolbar" content="false" />
<title>ThickBox 3.1调用方法+实例演示---汉化版---by legal</title>
<style type="text/css" media="all">
@import "Upimg/global.css";
@import "Upimg/thickbox.css";
</style>
<link rel="alternate stylesheet" type="text/css" href="Upimg/1024.css" title="1024 x 768" />
<script src="Upimg/jquery-1.1.3.1.pack.js" type="text/javascript"></script>
<script src="Upimg/thickbox-compressed.js" type="text/javascript"></script>
<script src="Upimg/global.js" type="text/javascript"></script>
</head>
<body id="pageTop">
<div id="pageContent"><!-- pageContent -->
<div id="examples"><!-- examples -->
<div id="container-5">
<ul class="anchors" style="width:100%">
<li><a href="#sectione-1">iFramed 内容</a></li>
<li><a href="#sectione-2">演示</a></li>
<li><a href="#sectione-3">调用代码</a></li>
</ul>
<div id="sectione-1" class="anchor">
<h5 class="hfivepadding">描述:</h5>
<p>
在ThickBox中打开被 iFramed URL.哈, 这正 <a href="http://amix.dk/greybox/demo.html">Greybox</a>的功能.
Opens URL's in an iframe inside of ThickBox. Yes, this is <a href="http://amix.dk/greybox/demo.html">Greybox</a> functionality.</p>
<h5>使用说明:</h5>
<ul>
<li>创建一个link元素 (<a href>)</li>
<li>给创建的这个link元素一个class属性，其值是：thickbox (class="thickbox")</li>
<li>给link元素的href属性指向一个你希望在ThickBox显示的URL。</li>
<li>href属性的URL后面追加上以下字符参数： <pre class="exampleCode"><code class="html">?KeepThis=true&TB_iframe=true&height=400&width=600</code></pre></li>
<li>根据你的实际需要改变上面的参数字符。</li>
<li>当然你也可以在参数字符串中加 modal=true<br/>(比如：?KeepThis=true&TB_iframe=true&height=400&width=600&modal=true) 这样当关闭ThickBox时会调用ThickBox iframe (self.parent.tb_remove())内部的一个tb_remove()函数。在演示中查看“打开iFrame Modal的演示”则要求点击ok才能关闭ThickBox。</li>
</ul>
<h5>重点提醒:</h5>
<p>所有其他参数字符都必须在TB_iframe 参数之前。URL中所有"TB" 之后的将被移除。</p>
</div>
<div id="sectione-2" class="anchor">
<p><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="Upimg/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被打开的演示</a></p>
</div>
<div id="sectione-3" class="anchor">
<pre class="tabscode" style="height:70px;"><code class="html"><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被打开的演示</a>
</code></pre>
</div>
</div>
<div id="container-6">
<ul class="anchors" style="width:100%">
<li><a href="#sectionf-1">AJAX内容</a></li>
<li><a href="#sectionf-2">演示</a></li>
<li><a href="#sectionf-3">调用代码</a></li>
</ul>
<div id="sectionf-1" class="anchor">
<h5 class="hfivepadding">描述:</h5>
<p>
采用一个隐藏的HTTP request (AJAX) 从同一个服务器上获取文件，并使用显示其内容。
</p>
<h5>使用说明:</h5>
<ul>
<li>创建一个link元素 (<a href>)</li>
<li>给创建的这个link元素一个class属性，其值是：thickbox (class="thickbox")</li>
<li>给link元素的href属性指向一个链接文件或是服务器目录。(href="ajaxLogin.htm") </li>
<li>在href属性的URL后面追加以下字符来结束URL: <pre class="exampleCode"><code class="html">?height=300&width=300</code></pre></li>
<li>根据需要更改宽和高的值。</li>
<li>当然，你也可以在上面的参数字符串再加上modal=true(比如. ?height=300&width=300&modal=true) 这样当关闭ThickBox时会调用ThickBox内部的一个tb_remove()函数。在演示中查看“login”这个例子则要求点击yes 或 no才能关闭ThickBox。</li>
</ul>
<h5>重点提醒:</h5>
<p>为了在新打开的Ajax ThickBox中打开新的Ajax内容，他的代码必须包含适当的 HTML (class=""thickbox) 来加载一个Ajax ThickBox (请留意演示例子)。其他唯一需要注意的一个地方就是调用的ThickBox必须包含宽和高，如果你给这两项留空，则窗口会自适应到默认大小（630*440）.</p>
</div>
<div id="sectionf-2" class="anchor">
<p><a href="Upimg/ajaxOverFlow.html?height=300&width=400" title="add a caption to title attribute / or leave blank" class="thickbox">有滚动条的内容</a>
<a href="Upimg/ajax.html?height=220&width=400" class="thickbox" title="add a caption to title attribute / or leave blank">没滚动条的内容</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内容</a></p>
</div>
<div id="sectionf-3" class="anchor">
<pre class="tabscode" style="height:100px;"><code class="html"><a href="Upimg/ajaxOverFlow.html?height=300&width=300" title="add a caption to title attribute / or leave blank" class="thickbox">有滚动条的内容</a>
<a href="Upimg/ajax.html?height=220&width=400" class="thickbox" title="add a caption to title attribute / or leave blank">没滚动条的内容</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内容</a></code></pre>
</div>
</div>
<div style="clear:both">点击<a href="http://jquery.com/demo/thickbox/" class="BTT">这里</a>查看原版英文,由<a href="http://www.ilegal.cn" class="BTT">legal</a>翻译,翻得不好多多原谅.<br/>
主要目的除了方便自己使用,也可以和大家分享下.关键是访问国外网站N慢.这样后大家看着也舒服.<a href="http://www.ilegal.cn" class="BTT">访问我的博客</a><br/>
本文版权归Cody Lindley 所有<br/>
PS:thickbox是由 Cody Lindley开发的一个jQuery插件。本thickbox3.1实例 updated on 08/08/2007
</div>
</div><!-- /examples -->
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-162561-1";
urchinTracker();
</script>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -