ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.
Overview
- ThickBox was built using the super lightweight jQuery library. Compressed, the jQuery library is 20k, uncompressed it's 58k.
- The ThickBox JavaScript code and CSS file only add an additional 15k (only 10k by using the thickbox-compressed.js) on top of the jQuery code. The CSS file could additionally be compressed if need be.
- ThickBox will resize images that are bigger than the browser window.
- ThickBox offers versatility (images, iframed content, inline content, and AJAX content).
- ThickBox will hide form elements in Windows IE 6.
- ThickBox will remain centered in the window even when the user scrolls the page or changes the size of the browser window. Clicking an image, the overlay, or close link will remove ThickBox.
- Due to the ThickBox creator's view that transitions should be tailored by individual authors, ThickBox windows do not implement fancy transitions. Feel free to add them as you see fit. Is this a feature? Well, some might say it is.
- ThickBox can be invoked from a link element, input element (typically a button), and the area element (image maps).
一直都想实现的效果，以前试用了很多这方面的插件，虽然效果实现了，但是毛病太多，最终还是不得不放弃，最近在浏览ZWW发布的一篇日志简单实现图片的ThickBox效果的日志中找到了一个非常方便的wordpress自带功能来实现这类功能的方法，而且还支持很多别的特效，因此迫不及待在博客更新上了。
其实Thickbox拥有很多很特别的功能，非常的适用，大家不妨去Thickbox官方瞧瞧，或许还有别的收获哦！
Thickbox支持很多的Jquery特效，方法在Thickbox主页也有介绍，大家也可以去瞧瞧。
来看看利用Thickbox实现的图片加载效果：
弄好咯，参考ZWW的做法遇到了2个问题。loadingAnimation.gif、thickbox.css、thickbox-compressed.js不加载，其实都是路径错位引起的，朋友们遇到了不妨把里面的相对路径直接改为绝对路径，反正现在博客的地址都是绝对固定的，没关系咯！
还有一个更大的问题就是无法使用rel参数，可能是主题引起的。正在研究中！
文章评论
没有效果，你重复加载jQ库了，1.3.2和1.4.2都加载了
@zwwooooo 突然又行了，还是把其中一个jQ库删了吧，浪费流量，影响速度
@zwwooooo 是你写的那个js加载的问题哈，我这个风格的路径他定义的和别的不一样，我直接给改为绝对路径了！