N
niall_mckiernan
Guest
I'm using two scripts on a website: MoodalBox - http://www.e-magine.ro/web-dev-and-desig... and SmoothGallery 2.0 - http://smoothgallery.jondesign.net/
I've had MoodalBox working on the site with no problems (until now).
I then added the slide show script which works fine but since adding it moodalbox does not function.
I think it must be something to do with the fact that there are two scripts on the one html page.
Is there a way I run there two without any problems?
Script of the page is below (Thanks in advance!):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-...
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/moodalbox.js"></script>
<link rel="stylesheet" href="css/moodalbox.css" type="text/css" media="screen" />
<script src="scripts/mootools.v1.11.js" type="text/javascript"></script>
<script src="scripts/jd.gallery.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/jd.gallery.css" type="text/css" media="screen" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Welcome to Flynns Photo Service</title>
<style type="text/css">
<!--
body,td,th {
color: #000000;
}
body {
background-color: #000000;
}
.style1 {font-family: Geneva, Arial, Helvetica, sans-serif}
a:link {
color: #FFFFFF;
text-decoration: none;
}
a:hover {
color: #CCCCCC;
text-decoration: underline;
}
a:visited {
color: #FFFFFF;
text-decoration: none;
}
a:active {
color: #999999;
text-decoration: none;
}
.style2 {
font-family: Geneva, Arial, Helvetica, sans-serif;
color: #FFFFFF;
}
.style3 {color: #000000}
.style5 {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size: 12px;
}
.style6 {font-size: 14px}
-->
</style>
</head>
<body>
<p align="center"><img src="Image3.jpg" width="800" height="200" /></p>
<script type="text/javascript">
function startGallery() {
var myGallery = new gallery($('myGallery'), {
timed: true,
showArrows: false,
showCarousel: false
});
}
window.addEvent('domready', startGallery);
</script>
<div class="content">
<div id="myGallery">
<div class="imageElement">
<h3>Item 1 Title</h3>
<p>Item 1 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/1.jpg" class="full" />
<img src="images/brugges2006/1-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 2 Title</h3>
<p>Item 2 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/2.jpg" class="full" />
<img src="images/brugges2006/2-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 3 Title</h3>
<p>Item 3 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/3.jpg" class="full" />
<img src="images/brugges2006/3-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 4 Title</h3>
<p>Item 4 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/4.jpg" class="full" />
<img src="images/brugges2006/4-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 5 Title</h3>
<p>Item 5 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/5.jpg" class="full" />
<img src="images/brugges2006/5-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 6 Title</h3>
<p>Item 6 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/6.jpg" class="full" />
<img src="images/brugges2006/6-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 7 Title</h3>
<p>Item 7 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/7.jpg" class="full" />
<img src="images/brugges2006/7-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 8 Title</h3>
<p>Item 8 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/8.jpg" class="full" />
<img src="images/brugges2006/8-mini.jpg" class="thumbnail" />
</div>
</div>
</div>
<p align="center" class="style5"><span class="style6"><a href="index.html">Home</a> <span class="style3">__</span></span> <span class="style6"><a href="about_us.html"rel="moodalbox" title="About Us">About Us</a> <span class="style3">__ </span><a href="gallery.html"rel="moodalbox 780 600" title="Gallery">Gallery</a> <span class="style3">__</span></span> <span class="style6"><a href="contact_us.html"rel="moodalbox" title="Contact Us">Contact Us</a> <span class="style3">__</span></span> <span class="style6"><a href="login.html"rel="moodalbox 300 100" title="Customer Login">Login</a></span><span class="style6"> <span class="style3">__</span></span> <span class="style6"><a href="loca
sorry, not all fitted in. heres the missing part of the script:
tion.html"rel="moodalbox 426 475" title="Location">Location</a></span><span class="style6"> <span class="style3">__</span></span> <span class="style6"><a href="booking.html"rel="moodalbox" title="Make a Booking">Make a Booking</a></span></p>
</body>
</html>
Thanks Again!!
I've had MoodalBox working on the site with no problems (until now).
I then added the slide show script which works fine but since adding it moodalbox does not function.
I think it must be something to do with the fact that there are two scripts on the one html page.
Is there a way I run there two without any problems?
Script of the page is below (Thanks in advance!):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-...
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/moodalbox.js"></script>
<link rel="stylesheet" href="css/moodalbox.css" type="text/css" media="screen" />
<script src="scripts/mootools.v1.11.js" type="text/javascript"></script>
<script src="scripts/jd.gallery.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/jd.gallery.css" type="text/css" media="screen" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Welcome to Flynns Photo Service</title>
<style type="text/css">
<!--
body,td,th {
color: #000000;
}
body {
background-color: #000000;
}
.style1 {font-family: Geneva, Arial, Helvetica, sans-serif}
a:link {
color: #FFFFFF;
text-decoration: none;
}
a:hover {
color: #CCCCCC;
text-decoration: underline;
}
a:visited {
color: #FFFFFF;
text-decoration: none;
}
a:active {
color: #999999;
text-decoration: none;
}
.style2 {
font-family: Geneva, Arial, Helvetica, sans-serif;
color: #FFFFFF;
}
.style3 {color: #000000}
.style5 {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size: 12px;
}
.style6 {font-size: 14px}
-->
</style>
</head>
<body>
<p align="center"><img src="Image3.jpg" width="800" height="200" /></p>
<script type="text/javascript">
function startGallery() {
var myGallery = new gallery($('myGallery'), {
timed: true,
showArrows: false,
showCarousel: false
});
}
window.addEvent('domready', startGallery);
</script>
<div class="content">
<div id="myGallery">
<div class="imageElement">
<h3>Item 1 Title</h3>
<p>Item 1 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/1.jpg" class="full" />
<img src="images/brugges2006/1-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 2 Title</h3>
<p>Item 2 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/2.jpg" class="full" />
<img src="images/brugges2006/2-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 3 Title</h3>
<p>Item 3 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/3.jpg" class="full" />
<img src="images/brugges2006/3-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 4 Title</h3>
<p>Item 4 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/4.jpg" class="full" />
<img src="images/brugges2006/4-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 5 Title</h3>
<p>Item 5 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/5.jpg" class="full" />
<img src="images/brugges2006/5-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 6 Title</h3>
<p>Item 6 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/6.jpg" class="full" />
<img src="images/brugges2006/6-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 7 Title</h3>
<p>Item 7 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/7.jpg" class="full" />
<img src="images/brugges2006/7-mini.jpg" class="thumbnail" />
</div>
<div class="imageElement">
<h3>Item 8 Title</h3>
<p>Item 8 Description</p>
<a href="#" title="open image" class="open"></a>
<img src="images/brugges2006/8.jpg" class="full" />
<img src="images/brugges2006/8-mini.jpg" class="thumbnail" />
</div>
</div>
</div>
<p align="center" class="style5"><span class="style6"><a href="index.html">Home</a> <span class="style3">__</span></span> <span class="style6"><a href="about_us.html"rel="moodalbox" title="About Us">About Us</a> <span class="style3">__ </span><a href="gallery.html"rel="moodalbox 780 600" title="Gallery">Gallery</a> <span class="style3">__</span></span> <span class="style6"><a href="contact_us.html"rel="moodalbox" title="Contact Us">Contact Us</a> <span class="style3">__</span></span> <span class="style6"><a href="login.html"rel="moodalbox 300 100" title="Customer Login">Login</a></span><span class="style6"> <span class="style3">__</span></span> <span class="style6"><a href="loca
sorry, not all fitted in. heres the missing part of the script:
tion.html"rel="moodalbox 426 475" title="Location">Location</a></span><span class="style6"> <span class="style3">__</span></span> <span class="style6"><a href="booking.html"rel="moodalbox" title="Make a Booking">Make a Booking</a></span></p>
</body>
</html>
Thanks Again!!