`
wuhaidong
  • 浏览: 349766 次
  • 性别: Icon_minigender_1
  • 来自: 青岛
社区版块
存档分类
最新评论

colorbox常见问题

jQueryIECSS浏览器Ajax
阅读更多

发现colorbox官方网站的troubleshoot写的比较好，转载一下。


1,flash覆盖colorbox：


This is not a colorbox specific problem，by default flash will overlay any html content. This can be prevented by setting the “wmode” param and embed attribute to

'transparent'.


这不是colorbox本身的问题，flash默认会覆盖所有的HTML内容，你可以设置wmode参数为transparent来避免这个问题。


2,colorbox在ie中的位置和行为异常：


这有可能是doctype(DTD)的问题。colorbox需要有个有效的DTD声明,否则浏览器会以怪异模式(quirks mode,在标准模式中，浏览器根据W3C所定来显示页面；而在怪异模式中，页面将以IE5，甚至IE4的显示页面的方式来表示，以保持以前的网页能正常显示)呈现网页内容。务必使用正确的DTD声明来确保浏览器以标准模式呈现网页。


下面这段声明会将IE浏览器设定成怪异模式

 

 

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
 

 

这段带有URL的声明可以将所有浏览器设定到标准模式

 

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd“>
 

 

3,colorbox的位置和行为异常(不区分浏览器):


这可能是源文件引用顺序错误导致的。JQuery和colorbox.css必须在jquery.colorbox.js之前引入，并且应该在JQuery的ready方法中调用colorbox，并且此调用要在引入jquery.colorbox.js之后。


4,用colorbox显示外部文档时显示不正确：


这是由于没有将iframe参数设为true。默认的方式只能正确显示可以在body标签中存放的内容。



如果你想显示一个完整的html文档（包括<html>,<head>和<body>等标签），那么要是用iframe参数。并且要设定高度和宽度，因为colorbox无法得知位于iframe内的网页内容的宽高。


另外，如果你想载入一段位于相同一名下的另一个文档的部分内容，可以使用下面的方法


$(‘#example’).colorbox({href:”document.html div#content”});
 

 

5,在ie中colorbox的边框不显示：


colorbox中提供的例子中有些使用了png图片的透明度效果。IE6不支持alpha透明度，并且在IE7和IE8中会出现黑底的效果。colorbox使用IE的css滤镜解决了这个问题，你可以在colorbox.css文件中看到这些代码。在例子中使用了相对路径，但用户将colorbox应用到自己的网站是经常更改image文件夹相对于css的路径。滤镜的路径也需要有相应的变动。请看下面的例子，假设你的images文件夹位于跟目录下。


在css文件中使用了错误的相对路径：

 

.AlphaImageLoader(src=images/internet_explorer/borderTopLeft.png
 

 

正确的路径：


.AlphaImageLoader(src=/images/internet_explorer/borderTopLeft.png
 

 

正确的绝对路径：


.AlphaImageLoader(src=http://your_domain.com/images/internet_explorer/borderTopLeft.png
 

 

6,尝试载入外部页面却获得"Request unsuccessful"的报错信息：


这可能是因为你尝试载入一个无效的URL或者ajax的方式载入其他域名下的文件。由于浏览器的限制，ajax方式必须载入与其在同一域名下的文件。并且ajax需要有服务器支持，如果本地测试必须安装apache服务。


7,如何通过ref属性关闭colorbox的群组功能：

 

$(‘a[rel="examples"]‘).colorbox({rel:’nofollow’});
 

 

8,JavaScript/jQuery 在colorbox中不工作：


这多数是因为在元素还没有载入到文档中时就尝试访问它，解决的方法是将这写js代码应到colorbox的onComplete调用中。


例：使用jQuery Forms插件：

 

$(‘#login_window’).colorbox({onComplete:function(){  
$(‘form#login’).ajaxForm();  
}});
 

 

9,在iframe外面打开colorbox：


任何在iframe中打开的内容会被限制在iframe中，除非你将colorbox放到它的上一级窗口中。你可以从iframe中返回parent窗口打开colorbox。


<a href=’login.php’ onclick=’parent.$.fn.colorbox({href:”login.php”}); return false;’>Open from parent</a>
 

 

这种方法不能用于group方式，因为parent文档无法访问iframe里的内容，也就是无法访问内部元素的rel属性

分享到：
| js乱码解决方法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics