Colorbox - a jQuery lightbox
http://www.jacklmoore.com/colorbox/
http://www.jacklmoore.com/colorbox/example5/
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
/* Automatically resize to content */
var y = $(document.body).height();
var x = $(document).width();
parent.$.colorbox.resize({innerWidth:x, innerHeight:y}); $("#button_cancel").click(function() {
parent.$.colorbox.close();//注:塗聚文
return false;
})
}); </script> <button id="button_cancel" type="button">cancel</button>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
$(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});
$(".iframe").colorbox({
onOpen:function(){ alert('onOpen: colorbox is about to open'); },
onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); }
onClosed:function(){ alert('關閉窗口'); window.location='Index.aspx';} //關閉時的狀態//注:塗聚文
}); $(".callbacks").colorbox({
onOpen:function(){ alert('onOpen: colorbox is about to open'); },
onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
onClosed:function(){ alert('onClosed: colorbox has completely closed'); } //關閉時的狀態
}); $("#click").click(function(){
$('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
return false;
}); }); </script>
Colorbox - a jQuery lightbox的更多相关文章
- 经典弹出层Colorbox - a jQuery lightbox
Colorbox - a jQuery lightbox A lightweight customizable lightbox plugin for jQuery Fork me on GitHub ...
- 20款美化网站的 jQuery Lightbox 灯箱插件
jQuery Lightbox 灯箱插件可以让你为您的网站和应用程序展示优雅的图像,视频 和其它内容(使用模式窗口).如果你是一个开发人员,你必须拥有 jQuery 灯箱插件集合,因为有一部分的客户会 ...
- jQuery Lightbox图片放大预览
简介:jQuery Lightbox图片放大预览代码是一款可以在用户点击页面中的小图片时,将该图片的高清版本以Lightbox的方式放大显示在页面的中间,提高用户的体验度. 效果展示 http://h ...
- 推荐15款响应式的 jQuery Lightbox 插件
利用现代 Web 技术,网络变得越来越轻巧与.模态框是突出展现内容的重要形式,能够让用户聚焦到重要的内容上去.在这个列表中,我们编制了15款响应式的 jQuery 灯箱库,这将有助于开发人员创建和设计 ...
- Chocolat.js – 响应式的 jQuery Lightbox 插件
Chocolat.js 使您能够显示一个或多个图像在同一页面上.给用户展示一组图片缩略图,可以显示全页或块.Chocolat.js 可以很好地处理所有主要的浏览器.它在下面这些浏览器测试通过:IE7+ ...
- FancyBox - 经典的 jQuery Lightbox 插件
FancyBox 是一款非常优秀的弹窗插件,能够为图片.HTML 内容和其它任务的多媒体内容提供优雅的弹出缩放效果.作为是最流行的 Lightbox 插件之一,可以通过 fitToView 实现自适应 ...
- jquery插件jquery.LightBox.js之点击放大图片并左右点击切换图片(仿相册插件)
该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的点击放大图片并左右点击切换图片的效果,您可以根据自己的实 ...
- 一款经典的 jQuery Lightbox 灯箱效果
一个灯箱效果的图片展示插件. 版本: jQuery v1.2.3+ jQuery Lightbox v2.7.1 github 实例预览 使用方法 载入 CSS 文件 <link rel=&qu ...
- 6款 jQuery Lightbox图片查看触控插件
偶然间在网上看到的几个图片预览的插件,挺好用的,顺手整理下来. 1:Zoomify – jQuery缩放效果lightbox插件 地址:http://www.dowebok.com/214.html ...
随机推荐
- SpringMVC的简单介绍及使用
一.简介 1.SpringMVC和Spring的关系: >软件开发的三层架构: web层[表示层.表现层]---->Service层---->Dao[DataBase Access ...
- MVC5 + EF6 入门完整教程1
https://www.cnblogs.com/miro/p/4030622.html 第0课 从0开始 ASP.NET MVC开发模式和传统的WebForm开发模式相比,增加了很多"约定& ...
- fork 炸弹
一段古老的Linux shell程序 :() { :|:& };: 这是bash shell的写法,首先定义了一个函数:(),花括号里面是函数体,这里递归执行函数本身,通过管道在后台再递归运行 ...
- Python + gevent模块对单个接口进行并发测试 1
本文知识点 利用gevent模块进行并发测试 代码如下 from gevent import monkey monkey.patch_all() import requests import geve ...
- MongoDB 配置服务
参考网址:https://jingyan.baidu.com/article/d5c4b52b906bafda560dc591.html 1.MongoDB 有一个不方便,需要配置服务,默认启动,否则 ...
- 7.使用jenkins+marathon+docker完成自动化部署
1.前置条件 1)Docker开启TCP端口,CloudBees Docker Build and Publish plugin插件会向目标主机docker生成docker镜像 开启docker ap ...
- ali代码风格
如下: <?xml version="1.0" encoding="UTF-8" standalone="no"?><pr ...
- like模糊查询%注入问题
android like 全局模糊查找文件命名 通过条件通过 like %search% 如果查找的关键字是% 那么就成了 like %%% 就会查找出所有的文件 解决办法是先把正则里面的匹配符 替换 ...
- do while循环
do while循环: 语法格式: do{ 循环体 }while(循环条件); 执行流程: 先执行循环体,然后判断条件,当条件为true时,则继续执行循环体,然后再判断条件... 一直到循环条件为fa ...
- hibernate框架的搭建
1 导入所需的jar包 1 导入hibernate必须的jar包 2 导入驱动包 2 创建数据库,准备表,实体 1 创建hibernate数据库 CREATE DATABASE hibernate; ...