Fancybox is not working in firefox or IE, but it is working in chrome, safari, and opera. I've used fancybox before without any problems, but for some reason it doesn't want to work in firefox. Has anyone ever heard of this happening?
Sorry about that, here you go:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Sample 5</title>
<link href="screen.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="scripts/jquery-1.4.2.min.js"></script>
<script src="scripts/jquery.color.js" type="text/javascript" charset="utf-8"></script>
<script src="scripts/jquery-glowing.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="scripts/textglow.js"></script>
<script type="text/javascript" src="scripts/fancybox/jquery.fancybox-1.3.1.pack.js"></script>
<link rel="stylesheet" href="scripts/fancybox/jquery.fancybox-1.3.1.css" type="text/css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
/* This is basic - uses default settings */
$("a.single_image").fancybox();
/* Apply fancybox to multiple items */
$("a.group").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 600,
'speedOut' : 200,
'overlayShow' : false
});
});
</script>
</head>
<body>
<div id="wrap">
<div id="header">
<div class="logo"><a href="#"></a></div>
<ul class="nav">
<li><a href="">home</a></li>
<li><a href="">info</a></li>
<li><a href="">forum</a></li>
<li><a href="">contact</a></li>
<li><a href="">about</a></li>
</ul>
</div>
<div id="content">
<div id="screenwrap">
<div class="screenborder"><a class="single_image" rel="group1" href="img/screenshot03big.jpg"><img src="img/screenshot03.jpg" alt=""/></a></div>
<div class="screenborder"><a class="single_image" rel="group1" href="img/screenshot05big.jpg"><img src="img/screenshot05.jpg" alt=""/></a></div>
<div class="screenborder"><a class="single_image" rel="group1" href="img/screenshot08big.jpg"><img src="img/screenshot08.jpg" alt=""/></a></div>
<div class="screenborder"><a class="single_image" rel="group1" href="img/screenshot07big.jpg"><img src="img/screenshot07.jpg" alt=""/></a></div>
<div class="screenborder"><a class="single_image" rel="group1" href="img/screenshot02big.jpg"><img src="img/screenshot02.jpg" alt=""/></a></div>
<div class="screenborder"><a class="single_image" rel="group1" href="img/screenshot01big.jpg"><img src="img/screenshot01.jpg" alt=""/></a></div>
</div>
<div id="parawrap">
<div class="paragraph">
<h2>Omnis Noster</h2>
<p>Maecenas dictum orci id libero luctus fermentum. Sed sit amet nibh sit amet nibh mollis fringilla et pretium arcu. Vestibulum pharetra leo ut lectus congue vitae aliquam sem posuere. </p>
</div>
<div class="paragraph">
<h2>Omnis Noster</h2>
<p>Maecenas dictum orci id libero luctus fermentum. Sed sit amet nibh sit amet nibh mollis fringilla et pretium arcu. Vestibulum pharetra leo ut lectus congue vitae aliquam sem posuere. </p>
</div>
<div class="paragraph">
<h2>Omnis Noster</h2>
<p>Maecenas dictum orci id libero luctus fermentum. Sed sit amet nibh sit amet nibh mollis fringilla et pretium arcu. Vestibulum pharetra leo ut lectus congue vitae aliquam sem posuere. </p>
</div>
</div>
<div class="clear"></div>
<div class="gallery"></div>
</div>
</div>
<div id="footer">
<p></p><div class="footlogo"></div>
</div>
</body>
</html>