I am trying to use shadowbox 3.0.3 in google chrome
I am getting:
in chrome
shadowbox.js:17 Uncaught TypeError: Cannot read property 'style' of undefined
in firefox
F is undefined g.find=(function(){var aD=/((?:((?:(...()}};g.skin=k;T.Shadowbox=g})(window); shadowbox.js (line 17)
seems to work fine in IE
My code is below:
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<script src="shadowbox.js"></script>
<link href="shadowbox.css" rel="stylesheet"/>
<script>
$(function() {
Shadowbox.init({skipSetup: true});
// open a welcome message as soon as the window loads
Shadowbox.open({
content: '<div id="welcome-msg">Welcome to my website!</div>',
player: "html",
title: "Welcome",
height: 350,
width: 350
});
})
</script>
</head>
<body>
</body>
</html>
what would be causing this?
Use window.load method as suggested in the docs:
<script type="text/javascript">
Shadowbox.init({
skipSetup: true
});
$(window).load(function() {
// open a welcome message as soon as the window loads
Shadowbox.open({
content: '<div id="welcome-msg">Welcome to my website!</div>',
player: "html",
title: "Welcome",
height: 350,
width: 350
});
});
</script>
This is just a guess but maybe Shadowbox.init() should go outside the $(function() ...), so that it is called before the window loads. Thats what the example on their site suggests: http://www.shadowbox-js.com/usage.html
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With