ThickBox – 网页图片弹出展示程序

Posted on by

ThickBox 3.1

Thickbox 是一个基于 jQuery 类库的 网页 UI 对话框 拓展工具，它用户显示单个图片，图片组，AJAX 请求内容或链接内容。

示例：http://jquery.com/demo/thickbox/#examples  （复制到你的浏览器）

所有资源均可以在这儿下载 http://jquery.com/demo/thickbox/

概述

  1. thickbox 基于超轻量级 JQUERY 类库，JQUERY 压缩后为20K，解压后58K。
  2. THICKBOX JavaScript 程序 和 CSS 代码只有15K（如果使用 compressed.js 只有10K），CSS 文件可以根据需求自行修改。
  3. thickbox 可以自动调整尺寸大于浏览器窗口的图片。
  4. thickbox 功能多样，可以用于 图片， iframe框架，内嵌的内容，AJAX 请求。
  5. ThickBox will hide form elements in Windows IE 6.
  6. ThickBox 能在使用者滚动页面或改变浏览器窗口大小的同时始终保持居中. 点击图片、覆盖层, 或关闭链接能移除 ThickBox.
  7. ThickBox 的创作者决定动画应该因人而异, 所以 ThickBox 不再使用动画了. 这是特性吗? 哦, 有人说是呀.
  8. thickbox 可以通过 <a>标签、 输入框（特别是按钮）和文本域(图象映象–图片的可点区域、图片多个链接区）

怎么使用 thickbox

为了让thickbox能够正确的运行和展示，使用之前先得确认网页符合 thickbox 要求的文档定义类型（DTD）。

1.thickbox基于JQUERY 类库，所以，你先需在网页的head里引用 jquery.js，然后再引用 thickbox.js（注意，jquery.js必须置于thickbox.js之前）
示例：

另外你还需要对 thickbox.js 或者 thickbox-compressed.js 进行一点修改。打开JS 文件，找到 ‘tb_pathToImage’ ，正确设置 loadingAnimation.gif 的路径。

2.在你的网页中外调 ThickBox.CSS 文件.
示例：

或

或者打开 thickbox.css ，把代码复制到现有的 css 文件里。
3. 观看例子, 学习使用不同的方法调用 ThickBox 的功能.
html 图片 示例

Single Image

支持的和经测试过的浏览器:

Windows IE 6.0, Windows FF 1.5.0.5, Windows Opera 9.0, Macintosh Safari 1.3.2 & 2.0.3, Macintosh FF 1.5

MIT 许可
http://www.opensource.org/licenses/mit-license.php
http://www.gnu.org/licenses/gpl.html

特此授权。任何人可以免费获取此软件的拷贝和他相关文档(“软件”),此软件不受任何限制。所不受的限制包括: 有权利使用, 拷贝, 修改, 合并, 出版, 分发, 颁发从属许可, 和/或买卖该软件的拷贝.

Comments are closed.