JQUERY THICKBOX弹出层插件


Posted in Javascript onAugust 30, 2008

.THICKBOX支持一下浏览器:
Windows IE 6.0, Windows IE 7+, Windows FF 2.0.0.6+, Windows Opera 9.0+, Macintosh Safari 2.0.4+, Macintosh FF 2.0.0.6+, Macintosh Opera 9.10……但是据我的使用,IE6还是有点问题的!下面我们首先来看它的调用:
1.肯定你先要下载jquery.js和thickbox.js了.还有thickbox.css也不能少!

<script type="text/javascript" src="path-to-file/jquery.js"></script> 
<script type="text/javascript" src="path-to-file/thickbox.js"></script> 
<link rel="stylesheet" href="path-to-file/thickbox.css" type="text/css" media="screen" /> 
//path-to-file 就是你放这三个文件的路径

2.弹出单张图片的方法:
<a href="images/single.jpg" title="add a caption to title attribute / or leave blank" class="thickbox"><img src="images/single_t.jpg" alt="Single Image"/></a>

3.多张图片实现分页也很简单:
<a href="images/plant1.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="images/plant1_t.jpg" alt="Plant 1" /></a> 
<a href="images/plant2.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="images/plant2_t.jpg" alt="Plant 2" /></a> 
<a href="images/plant3.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="images/plant3_t.jpg" alt="Plant 3" /></a> 
<a href="images/plant4.jpg" title="add a caption to title attribute / or leave blank" class="thickbox" rel="gallery-plants"><img src="images/plant4_t.jpg" alt="Plant 4" /></a>

4.弹出网页inLINECONTENT
<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" /> 
//重要的是 #TB_inline?

5.iFRAME形式的
<a href="ajax.PHP?keepThis=true&TB_iframe=true&height=250&width=400" title="add a caption to title attribute / or leave blank" class="thickbox">Example</a>

所有调用的样式都得加上class=”thickbox”.这是控制弹出的效果,具体可以参照JQUERY的官方站点对THICKBOX的介绍,里面有具体效果:http://jquery.com/demo/thickbox/
Javascript 相关文章推荐
在IE模态窗口中自由查看HTML源码的方法
Mar 08 Javascript
kmock javascript 单元测试代码
Feb 06 Javascript
jQuery contains过滤器实现精确匹配使用方法
Apr 12 Javascript
jQuery 1.9移除了$.browser可以使用$.support来替代
Sep 03 Javascript
jQuery学习笔记之jQuery中的$
Jan 19 Javascript
分享自己用JS做的扫雷小游戏
Feb 17 Javascript
IScroll5 中文API参数说明和调用方法
May 21 Javascript
纯js实现html转pdf的简单实例(推荐)
Feb 16 Javascript
详解JSONObject和JSONArray区别及基本用法
Oct 25 Javascript
实战node静态文件服务器的示例代码
Mar 08 Javascript
JavaScript函数式编程(Functional Programming)组合函数(Composition)用法分析
May 22 Javascript
jQuery实现回到顶部效果
Oct 19 jQuery
IE php关于强制下载文件的代码
Aug 23 #Javascript
FormValidate 表单验证功能代码更新并提供下载
Aug 23 #Javascript
Javascript 篱式条件判断
Aug 22 #Javascript
解决AJAX中跨域访问出现'没有权限'的错误
Aug 20 #Javascript
javascript:void(0)的真正含义实例分析
Aug 20 #Javascript
利用404错误页面实现UrlRewrite的实现代码
Aug 20 #Javascript
一些不错的js函数ajax
Aug 20 #Javascript
You might like
十天学会php之第九天
2006/10/09 PHP
PHP 面向对象程序设计(oop)学习笔记(一) - 抽象类、对象接口、instanceof 和契约式编程
2014/06/12 PHP
smarty表格换行实例
2014/12/15 PHP
两种php给图片加水印的实现代码
2020/04/18 PHP
PHP定时执行任务的3种方法详解
2015/12/21 PHP
thinkPHP简单调用函数与类库的方法
2017/03/15 PHP
详谈php ip2long 出现负数的原因及解决方法
2017/04/05 PHP
极酷的javascirpt,让你随意编辑任何网页
2007/02/25 Javascript
清华大学出版的事半功倍系列 javascript全部源代码
2007/05/04 Javascript
jQuery中获取checkbox选中项等操作及注意事项
2013/11/24 Javascript
jquery选择器之属性过滤选择器详解
2014/01/27 Javascript
jquery弹出遮掩层效果【附实例代码】
2016/04/28 Javascript
JS实现的简单轮播图运动效果示例
2016/12/22 Javascript
js实现登录框鼠标拖拽效果
2017/03/09 Javascript
使用Math.max,Math.min获取数组中的最值实例
2017/04/25 Javascript
Vue中使用vux的配置详解
2017/05/05 Javascript
使用Vue.js和Flask来构建一个单页的App的示例
2018/03/21 Javascript
js自定义input文件上传样式
2018/10/26 Javascript
解决vant的Toast组件时提示not defined的问题
2020/11/11 Javascript
vue 在单页面应用里使用二级套嵌路由
2020/12/19 Vue.js
基于Python实现对PDF文件的OCR识别
2016/08/05 Python
Python工程师面试必备25条知识点
2018/01/17 Python
Python3.6笔记之将程序运行结果输出到文件的方法
2018/04/22 Python
目前最全的python的就业方向
2018/06/05 Python
python基础梳理(一)(推荐)
2019/04/06 Python
Lookfantastic葡萄牙官方网站:欧洲第一大化妆品零售商
2018/03/17 全球购物
英国受欢迎的运动鞋和街头服装商店:Footasylum
2018/06/12 全球购物
 Alo Yoga官网:购买瑜伽服装
2018/06/17 全球购物
Currentbody澳大利亚:美容仪专家
2019/11/11 全球购物
招商业务员岗位职责
2013/12/16 职场文书
应届生如何写自荐信
2014/01/05 职场文书
综合实践教学反思
2014/01/31 职场文书
调查研究项目计划书
2014/04/29 职场文书
2015年乡镇统计工作总结
2015/04/22 职场文书
古诗文之爱国名句(77句)
2019/09/24 职场文书
总结一些Java常用的加密算法
2021/06/11 Java/Android