Fancybox not working in IE8 - method "onCleanup" not supported
So I'm testing out fancybox. Working with this simple example (which is defined inside body:
<link rel="stylesheet" href="../../Content/Scripts/fancybox/jquery.fancybox-1.3.4.css"
type="text/css"/>
<script type="text/javascript" src="../../Content/Scripts/fancybox/jquery.fancybox-1.3.4.js"></script>
<script type="text/javascript" src="../../Content/Scripts/fancybox/jquery.easing-1.3.pack.js"></script>
<scr开发者_StackOverflowipt type="text/javascript">
function ShowModal() {
$.fancybox('<h2>test</h2><p>asdf</p>', {
'transitionIn': 'fade',
'transitionOut': 'fade'
});
}
</script>
I call the ShowModal function elsewhere, and also have jquery referenced in head.
This works fine in both Firefox and Chrome - but in IE8 I get a js error on line 324 - possibly related to the "onCleanup" method.
I chrome I had this error earlier: Uncaught TypeError: Object # has no method 'onCleanup'
Which I assumed was the same error IE was complaining about, I double-checked some script paths and the error went away in Chrome, but IE still complains - can anyone help me?
It was of course because my link tag isn't in the head - I seriously gotta stop thinking zebra, just cause I see stripes.
Regarding this error (result of currentOpts.onCleanup [undefined] is not a function on line 324)
I spent about 4 hours today trying to figure this one out. I DID have the fancybox stylesheet included, and I was doing everything right. Turns out there is a stupid bug in FancyBox. I've found out the cause:
If any stylesheets with a non-blank title attribute appear before the Fancybox css, you will get this error. This occurs in all browsers.
WILL THROW THIS ERROR:
<head>
<title>OH NOES</title>
<link rel="stylesheet" href="/css/mysite.css" type="text/css" media="all" title="Main Styles" charset="utf-8">
<link rel="stylesheet" href="/css/jquery.fancybox-1.3.4.css" type="text/css" media="screen" title="Modal Dialog Support" charset="utf-8">
THE SOLUTION IS DO ONE OF THESE THINGS
1. No title attribute any stylesheet you include before the fancybox css
<head>
<title>THIS WILL WORK</title>
<link rel="stylesheet" href="/css/mysite.css" type="text/css" media="all" charset="utf-8">
<link rel="stylesheet" href="/css/jquery.fancybox-1.3.4.css" type="text/css" media="screen" title="Modal Dialog Support" charset="utf-8">
2. Or, Include fancybox's css first.
<head>
<title>THIS WILL WORK TOO</title>
<link rel="stylesheet" href="/css/jquery.fancybox-1.3.4.css" type="text/css" media="screen" title="Modal Dialog Support" charset="utf-8">
<link rel="stylesheet" href="/css/mysite.css" type="text/css" media="all" title="Main Styles" charset="utf-8">
(Thanks, Fancybox, for wasting half of my day.)
精彩评论