要去除colorbox的关闭按钮,网上找了好多资料,都没找到其中用设置close参数的方式来解决,有找到的麻烦告诉我声,然后只好在onload事件中将这按钮remove或者hide()掉,代码如下:

$('selector').colorbox({onLoad:function(){

$('#cboxClose').remove();}});
$(".class_name").colorbox({innerWidth:500,innerHeight:400,iframe:true,escKey:false,overlayClose:false,onLoad: function() {$('#cboxClose').remove();

}});

另附上colorbox的使用方法:

ColorBox是一个基于jQuery 1.3 的轻量级,自定义灯箱插件,功能非常强大,支持图片,图片组,ajax,inline和iframed内容,灯箱样式完全由用户控制,可自定义CSS样 式,不需要改写ColorBox库文件就能重写展示效果设置,支持加载预处理提示等等,效果图如下:

使用说明

1,jQuery 1.3库文件

2,colorbox 库文件

3,灯箱效果CSS样式文件

使用实例如下:

一,使用ColorBox灯箱显示一张图片和图片组

(1)js部分

$.fn.colorbox.settings.transition = "fade";

$.fn.colorbox.settings.bgOpacity = "0.9";

$.fn.colorbox.settings.contentCurrent = "image {current} of {total}";

$(".cpModal").colorbox();

transition设置ColorBox灯箱的过渡效果,如上:fade

bgOpacity设置ColorBox灯箱的背景透明度,如上:0.9

contentCurrent设置ColorBox灯箱的当前图片,如上:image {current} of {total}

(2)HTML部分

<p><a class="cpModal" href="marylou.jpg" >单张图片</a></p>

<p><a class="cpModal" href="biuuu1.jpg" >图片组1</a></p>

<p><a class="cpModal" href="biuuu2.jpg" >图片组2</a></p>

<p><a class="cpModal" href="biuuu3.jpg" >图片组3</a></p>

二,使用ColorBox灯箱显示ajax加载HTML页面

(1)js部分

$("#ajax").colorbox({contentWidth:"300px", contentHeight:"195px"});

contentWidth设置ColorBox灯箱的内容宽度,如上:300px

contentHeight设置ColorBox灯箱的内容高度,如上:195px

(2)HTML部分

<p><a id="ajax" href="ajax.html">Ajax HTML</a></p>

ajax.html表示加载的html页面,

三,使用ColorBox灯箱显示flash页面效果

(1)js部分

$("#flash").colorbox({contentAjax:"flash.html"});

(2)HTML部分

<p><a id="flash" href="http://www.youtube.com/watch?v=lBvaHZIrt0">Flash / Video</a></p>

四,使用ColorBox灯箱显示Inline HTML效果


(1)js部分

$("#inline").colorbox({contentWidth:"500px", contentInline:"#inline-content"});

contentInline设置ColorBox灯箱的inline内容

(2)HTML部分

<p><a id="inline" href="#">Inline HTML</a></p>

<div style="display:none">

<div id="inline-content">

<div style="padding:10px">

<p>必优博客</p>

<p>www.biuuu.com</p>

</div>

</div>

</div>

五,使用ColorBox灯箱显示Iframed框架内容效果

(1)js部分

$("#google").colorbox({contentWidth:"750px", contentHeight:"450px", contentIframe:true});

contentIframe设置ColorBox灯箱的内容是否为框架

(2)HTML部分

<p><a id="google" href="http://www.google.com">Iframed内容</a></p>

ColorBox灯箱配置如下:

transition 'elastic' 表示灯箱过渡效果,可选"elastic" or "fade"

transitionSpeed    350 表示灯箱过渡效果展示的速度

initialWidth    300 表示灯箱初始化宽度

initialHeight    100 表示灯箱初始化高度

contentWidth    false 表示是否设置一个固定的宽度

contentHeight    false 表示是否设置一个固定的高度

contentAjax    false 表示是否是一个ajax加载

contentInline    false 表示是否是一个inline

contentIframe    false 表示是否是一个iframe

bgOpacity 0.85 表示灯箱的背景透明度

preloading    true 表示是否预加载

contentCurrent    '{current} of {total}' 表示灯箱展示的当前图片和总数

contentPrevious    'previous' 表示上一个锚,类似于rel属性

contentNext    'next'    表示下一个锚,类似于rel属性

modalClose    'close' 锚文本关闭链接,可选Esc或close

jQuery插件ColorBox彩盒使用非常简单,可实现功能非常多,如弹出新窗口,弹出图片,弹出框架等等,值得推荐。

介绍内容来自 http://www.biuuu.com/

设置的值

默认值

transition

"elastic"

过渡效果,可以是"elastic", "fade", or "none".

speed

350

设置过渡效果的持续时间,毫秒

href false

Example:$('h1').colorbox({href:"welcome.html"})

这个用来设置一个锚标记的值或者一个不是锚的元素,例如图像或者表单的按钮,例如:

title false

这可以为Colorbox设置一个标题

rel false

Example:$('#example a').colorbox({rel:'group1'})

这个可以根据元素的rel属性设置要显示的元素集合,也可以覆盖一个存在的rel属性

width false

Example: "100%", "500px", or 500

设置宽度,包括边框和按钮

height false

Example: "100%", "500px", or 500

设置高度,包括边框和按钮

innerWidth false

Example: "50%", "500px", or 500

这个可以设定一个固定的内大小,包括边框和按钮

innerHeight false

Example: "50%", "500px", or 500

这个可以设定一个固定的内高度,包括边框和按钮

initialWidth 300

设置初始化宽度

initialHeight 100

设置初始化高度

maxWidth false

Example: "100%", 500, "500px"

设置内容的最大宽度

maxHeight false

Example: "100%", 500, "500px"

设置内容的最大高度

scalePhotos true

如果是true且maxWidth, maxHeight, innerWidth, innerHeight, width, 或者 height 被设置,

Colorbox会缩放图片以使用边框

scrolling true

如果是false,Colorbox不会为了溢出元素设置滚动条

iframe false

如果是true,元素会在Iframe中显示

介绍

inline false

Example: $("#inline").colorbox({inline:true, href:"#myForm"});

如果是true,jQuery选择器可以用来选择要显示的元素。例如:

html false

Example: 
$.fn.colorbox({html:'

Hello

'});

这个是直接让你显示HTML代码,例

photo false

如果为true,ColorBox只会把元素按照图片显示,防止类似photo.php?pic=1这样的连接被误认为是网页

opacity 0.85

遮罩层不透明度 从0-1之间取值

open false

如果为true,ColorBox会自动开启

preloading true

如果为True,ColorBox会自动预载要显示图片

overlayClose true

为true单击遮罩层就可以把ColorBox关闭

slideshow false

为True,会自动滚动图片

slideshowSpeed 2500

设置时间,毫秒

slideshowAuto true

为tuue,滑动会自动开始

slideshowStart "start slideshow"

开始自动滑动按钮的文本

slideshowStop "stop slideshow"

停止自动滑动按钮的文本

current "{current} of {total}"

文本内容:现在正在显示的元素序号

previous "previous"

“上一个”按钮的文本

next "next"

“下一个”按钮的文本

close "close"

“关闭”按钮的文本

转载于:https://www.cnblogs.com/zhiji6/archive/2012/05/08/2489555.html

colorbox去除close关闭按钮,附上colorbox的基本使用方法相关推荐

  1. python字符计数怎样去除空格_去除python中的字符串空格的简单方法

    python编程中,我们在修改代码,遇到空格很多的情况下,我们要删除空格.本文小编整理了三种字符串去除空格的方法: 方法一:使用字符串函数replace,去除全部空格. 实例: >>> ...

  2. phpcmsV9站群去除域名绑定目录中的HTML的方法

    直奔主题: 如何去除网面URL路径中的/html字符串? 也就是"phpcms站群管理时,将 网址http://father/html/son" 精简变为 http://fathe ...

  3. php去除html标签 空白,php使用strip_tags()去除html标签仍有空白的解决方法

    在项目的时候经常遇到html去除之后仍然有空白,吾爱编程接下来通过以下实例讲述了php使用strip_tags()去除html标签仍有空白的解决方法.具体如下: $subject = strip_ta ...

  4. php 去掉后导字符,PHP去除字符串最后一个字符的三种方法实例

    前言 本文讲讲PHP中如何正确的去除字符串中的最后一个字符,之前跟大家分享过一篇关于PHP去除字符串最后一个字符的三种方法的文章,但是没给出实例,下面话不多说,直接上代码,相信一眼就能看出来了,直接将 ...

  5. python中怎么替换字母_python去除拼音声调字母,替换为字母的方法

    第一种方法 import sys import unicodedata s = "Lǐ Zhōu Wú" remap = { # ord返回ascii值 ord('\t'): '' ...

  6. css关闭窗口按钮的代码,JS+CSS实现带关闭按钮DIV弹出窗口的方法

    这篇文章主要介绍了JS+CSS实现带关闭按钮DIV弹出窗口的方法,实例分析了div弹出层窗口的实现技巧,非常具有实用价值,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了JS+CSS实现带关 ...

  7. python剔除字母_python去除拼音声调字母,替换为字母的方法

    第一种方法 import sys import unicodedata s = "Lǐ Zhōu Wú" remap = { # ord返回ascii值 ord('t'): '', ...

  8. python 单词拆音节_python去除拼音声调字母,替换为字母的方法

    python去除拼音声调字母,替换为字母的方法 第一种方法 import sys import unicodedata s = "Lǐ Zhōu Wú" remap = { # o ...

  9. python如何互换两个字母_python去除拼音声调字母,替换为字母的方法

    第一种方法 import sys import unicodedata s = "Lǐ Zhōu Wú" remap = { # ord返回ascii值 ord('\t'): '' ...

  10. 关于iOS去除数组中重复数据的几种方法

    在工作工程中我们不必要会遇到,在数组中有重复数据的时候,如何去除重复的数据呢? 第一种:利用NSDictionary的AllKeys(AllValues)方法 代码: NSArray *dataArr ...

最新文章

  1. 『非常重要』非矿工用户如何安全度过BCH11月算力战历史时刻!
  2. 偷天换日——新型浏览器劫持木马“暗影鼠”分析
  3. Python入门100题 | 第049题
  4. c#中windows验证连接字符串
  5. mybatis学习(46):二级缓存被刷新的情况
  6. 处理百万级以上的数据提高查询速度的方法
  7. 首次!华人获世界科学奖,其海洋蓝色能源技术或解决世界能源需求
  8. 字符串处理 —— 单模式匹配 —— MP 算法与 KMP 算法
  9. C#联通新版验证码识别的实现[转]
  10. carplant_mxnet
  11. Python Day10 MySQL 01
  12. React Native之APK文件签名及打包
  13. 实用 —— PowerCLI (二)
  14. win下MySQL 8.0.11 修改密码、开启远程访问
  15. 怎么隐藏php版本,Linux服务器中怎样隐藏PHP版本
  16. 行政管理专业考计算机研究生分数,行政管理学,考研,历年分数线是多少?
  17. 10+必备的 WORDPRESS 常用插件
  18. java反编译工具(XJad)
  19. socks代理和http代理的区别_浅析socks代理如何使用TCP和UDP协议
  20. 如何在工作中设定和使用 SMART 目标

热门文章

  1. Flixel Dame Tank学习一:半成品坦克大战
  2. localstorage,sessionstorage,cookie
  3. ARM嵌入式体系结构与接口技术
  4. c++ 的interface
  5. Python-Scrapy 获取历史双色球开奖号码
  6. 迅雷thunder://协议解密
  7. LeetCode——四数之和
  8. TIBCO.Rendezvous简单的发消息的过程
  9. 什么是Automata(I): Web 3.0的最后一块拼图
  10. Email 邮件方式激活注册账号