lawtzdesign
Technical User
Hi guys
I have brought a website template from template monster and the gallery feature doesnt work as standard (ie, when you click on the thumbnails they dont enlarge).
They give you a tutorial which I have attempted to do but it doesnt seem to work. I wonder if someone may be able to help?
The page is lawtzdesign.com/index-2 but note the that page is not the one I've tried to edit - i havent uploaded that version yet. I've pasted below the code from the page.
Thanks.
Si
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "<html xmlns=" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" />
<link href="layout.css" rel="stylesheet" type="text/css" />
<script src="js/mootools.js" type="text/javascript"></script>
<script src="js/jquery-1.4.1.js" type="text/javascript"></script>
<script src="js/cufon-yui.js" type="text/javascript"></script>
<script src="js/cufon-replace.js" type="text/javascript"></script>
<script src="js/Swiss_721_800.font.js" type="text/javascript"></script>
<script src="js/Swiss_721_200.font.js" type="text/javascript"></script>
</head>
<script type="text/javascript">
var slides = new Array(6);
var j=0;
for(var i=1; i<=6; i++){
slides = new Image();
slides.src = "images/page3-big " + i + ".jpg"; }
function Swap(number){
document.slide.src = slides[number].src;}
</script>
<body id="page3">
<div class="inner-tail">
<div class="inner">
<div id="header">
<div class="main">
<div class="logo">
<a href="index.html"><img src="images/logo.png" alt="" class="png" /></a>
</div>
</div>
</div>
<div id="content">
<div class="main">
<div class="extra">
<a href="index.html"><img src="images/button2.gif" alt="" class="button1" /></a>
<div class="indent">
<div class="container divider">
<div class="col-1 col-pad">
<h2>Portfolio</h2>
<a href="#"><img name="slide" src="images/page3-big1.jpg" width="393" height="283"></a>
</div>
<div class="col-2">
<div class="scroll margin scroll1 ">
<div class="col">
<div class="gallery"><a href="javascript:Swap(2)"><a href="javascript:Swap(2)"><a href="javascript:Swap(2)"></a><a href="javascript:Swap(1)"><img src="images/page3-img1.jpg" alt="" /></a></a></a><a href="javascript:Swap(2)"><img src="images/page3-img2.jpg" alt="" class="last" /></a>
<a href="javascript:Swap(3)"><img src="images/page3-img3.jpg" alt="" /></a><a href="javascript:Swap(4)"><img src="images/page3-img4.jpg" alt="" class="last" /></a>
<a href="javascript:Swap(5)"><img src="images/page3-img5.jpg" alt="" /></a><a href="javascript:Swap(6)"><img src="images/page3-img6.jpg" alt="" class="last" /></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--footer -->
<div id="footer">
<div class="main">
<div class="container">
<div class="footer-menu">
<ul>
<li class="first"><span class="bodytexty"><a href="index-1.html">About Us</a></span></li>
<li class="active"><span class="bodytexty"><a href="index-2.html">Portfolio</a></span></li>
<li><a href="index-3.html" class="bodytexty">What We Do</a></li>
<li><a href="index-4.html" class="bodytexty">Contact Us</a></li>
</ul>
</div>
<div class="policy"></div>
</div>
</div>
</div>
<!--footer end-->
</div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>
I have brought a website template from template monster and the gallery feature doesnt work as standard (ie, when you click on the thumbnails they dont enlarge).
They give you a tutorial which I have attempted to do but it doesnt seem to work. I wonder if someone may be able to help?
The page is lawtzdesign.com/index-2 but note the that page is not the one I've tried to edit - i havent uploaded that version yet. I've pasted below the code from the page.
Thanks.
Si
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "<html xmlns=" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" />
<link href="layout.css" rel="stylesheet" type="text/css" />
<script src="js/mootools.js" type="text/javascript"></script>
<script src="js/jquery-1.4.1.js" type="text/javascript"></script>
<script src="js/cufon-yui.js" type="text/javascript"></script>
<script src="js/cufon-replace.js" type="text/javascript"></script>
<script src="js/Swiss_721_800.font.js" type="text/javascript"></script>
<script src="js/Swiss_721_200.font.js" type="text/javascript"></script>
</head>
<script type="text/javascript">
var slides = new Array(6);
var j=0;
for(var i=1; i<=6; i++){
slides = new Image();
slides.src = "images/page3-big " + i + ".jpg"; }
function Swap(number){
document.slide.src = slides[number].src;}
</script>
<body id="page3">
<div class="inner-tail">
<div class="inner">
<div id="header">
<div class="main">
<div class="logo">
<a href="index.html"><img src="images/logo.png" alt="" class="png" /></a>
</div>
</div>
</div>
<div id="content">
<div class="main">
<div class="extra">
<a href="index.html"><img src="images/button2.gif" alt="" class="button1" /></a>
<div class="indent">
<div class="container divider">
<div class="col-1 col-pad">
<h2>Portfolio</h2>
<a href="#"><img name="slide" src="images/page3-big1.jpg" width="393" height="283"></a>
</div>
<div class="col-2">
<div class="scroll margin scroll1 ">
<div class="col">
<div class="gallery"><a href="javascript:Swap(2)"><a href="javascript:Swap(2)"><a href="javascript:Swap(2)"></a><a href="javascript:Swap(1)"><img src="images/page3-img1.jpg" alt="" /></a></a></a><a href="javascript:Swap(2)"><img src="images/page3-img2.jpg" alt="" class="last" /></a>
<a href="javascript:Swap(3)"><img src="images/page3-img3.jpg" alt="" /></a><a href="javascript:Swap(4)"><img src="images/page3-img4.jpg" alt="" class="last" /></a>
<a href="javascript:Swap(5)"><img src="images/page3-img5.jpg" alt="" /></a><a href="javascript:Swap(6)"><img src="images/page3-img6.jpg" alt="" class="last" /></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--footer -->
<div id="footer">
<div class="main">
<div class="container">
<div class="footer-menu">
<ul>
<li class="first"><span class="bodytexty"><a href="index-1.html">About Us</a></span></li>
<li class="active"><span class="bodytexty"><a href="index-2.html">Portfolio</a></span></li>
<li><a href="index-3.html" class="bodytexty">What We Do</a></li>
<li><a href="index-4.html" class="bodytexty">Contact Us</a></li>
</ul>
</div>
<div class="policy"></div>
</div>
</div>
</div>
<!--footer end-->
</div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>