jquery plugin problem

[robertobaggio2k]

alright this thing is driving me off the wall!

i inserted this plugin on our new website which is currently on a private server for testing purposes, and the plugin above featured products doesnt seem to wanna work correctly, only sometimes it shows fine but as soon as i press refresh it screws up again.

http://vjepd.zqcah.servertrust.com/

Above is the link to the website.

Btw any opinions and feedback is also appreciated as we are going live this friday.

Thanks for your help!

Here's the html code

<link href="/v/vspfiles/jmenu/css/main.css" rel="stylesheet" type="text/css">
<link href="/v/vspfiles/jmenu/css/slideshow.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="https://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/v/vspfiles/jmenu/src/jquery.slideshow.js"></script>


	<div id="app">
		<div class="slideShow">
			<ul class="slides" style="width: 500px">
				<li class="slide selected" style="position: absolute; display: list-item; "><img src="/v/vspfiles/assets/images/freeshipping1.gif" width="500px" border="0" alt=""></li>
				<li class="slide" style="position: absolute; display: none; "><img src="/v/vspfiles/assets/images/freeshipping1.gif" width="500px" border="0" alt=""></li>
				<li class="slide" style="position: absolute; display: none; "><img src="/v/vspfiles/assets/images/freeshipping1.gif" width="500px" border="0" alt=""></li>
				<li class="slide" style="position: absolute; display: none; "><img src="/v/vspfiles/assets/images/freeshipping1.gif" width="500px" border="0" alt=""></li>

			</ul>
			<ul class="navigation">
				<li><a href="javascript:void(0);" class="page">1</a></li>
				<li><a href="javascript:void(0);" class="page">2</a></li>
				<li><a href="javascript:void(0);" class="page">3</a></li>
				<li><a href="javascript:void(0);" class="page">4</a></li>
			</ul>
		</div>
		<script type="text/javascript">
		$(document).ready(function() {
			$('.slideShow').slideShow({
				hoverNavigation: false,
				interval: false
			});
		});
		</script>
	</div>

here's the main css code

#app {
	margin: 0px auto;
	max-width: 525px;
}
#footer {
	border-top: 5px solid #939393;
	padding-top: 0.25em;
}

ul.inline li {
	display: inline-block;
}
ul.list, ol {
	margin: 0em 0em 1em 0em;
}
ol li {
	list-style-type: decimal;
	margin-left: 1.5em;
}
ul.list li {
	list-style-type: disc;
	margin-left: 1.5em;
}

dl.footnotes {
	font-size: 0.8em;
	line-height: 1.5em;
	border-top: 1px solid #D8D8D8;
}
dl.footnotes dt {
	width: 10px;
	float: left;
	font-weight: bold;
}
dl.footnotes dd {
}

.tag {
	color: #7F7F7F;
	margin: 0em 0.2em 0em 0em;
	font-size: 0.5em;
	padding: 0.2em 0.3em;
	background-color: #E6E6E6;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
	-moz-box-shadow: 1px 1px 1px rgba(90,90,90,0.3);
	-webkit-box-shadow: 1px 1px 1px rgba(90,90,90,0.3);
	box-shadow: 1px 1px 1px rgba(90,90,90,0.3);
}

.debugOutput {
	display: none;
}

here's the slideshow css code

/* slideshow styles */
.slideShow ul,
.slideShow li,
.slideShow ol {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	font-family: Geneva, Arial, Verdana;
}
.slideShow {
	padding: 10px;
	border: 1px solid #B3B3B3;
	clear: both;
	margin-bottom: 10px;
}

/** navigation **/
.slideShow .navigation {
	margin: 5px 0px 0px 0px;
	clear: left;
	display: block;
}
.slideShow .navigation li {
	display: inline;
}
.slideShow .navigation a {
	background-color: #B3B3B3;
	margin: 0px 2px 0px 0px;
	padding: 3px 8px;
	color: #232323;
	display: inline-block;
	text-decoration: none;
	border: 1px solid #fff;
	font-size: 0.8em;
	text-shadow: 0px 1px rgba(255,255,255,0.5);
	text-transform: uppercase;
}
.slideShow .thumbs a {
	padding: 0px;
	overflow: hidden;
	background-color: transparent;
	height: 50px;
}
.slideShow .navigation a:hover,
.slideShow .navigation a.selected {
	background-color: #6C6C6C !important;
	border: 1px solid #6C6C6C;
	color: #000000;
}
.slideShow ol.topNavigation {
	margin: 0px 0px 10px 0px;
}

/** slides with more than an image in it **/
.slide h1 {
	position: absolute;
	background-color: #ffffff;
	left: 0px;
	top: 0px;
}

.slide dl dt {
	width: 500px;
}

/** slides with text over images **/
.slide p {
	margin: 1em;
	position: absolute;
	background-color: #000;
	color: #fff;
	z-index: 1;
	padding: 0.2em 0.8em;
}
.slide p a {
	color: #fff;
}

/** slideshow with images in navigation **/
.navigation.white a, .navigation.white li {
	background-color: #ffffff;
}
.navigation.white a {
	border: 1px solid #ffffff;
	padding: 0px;
	line-height: 0.8em;
}
.navigation.white a:hover,
.navigation.white a.selected {
	background-color: #ffffff;
	border: 1px solid #999;
}

If you know of a better looking slideshow plugin let me know :)

[robertobaggio2k]

anybody?

[sweetsam]

The slideshow seems to work fine here. What exactly is the point of that alert which appears on right clicking on images? You are only going to annoy users with that. It serves no other purpose.

[robertobaggio2k]

yea i didnt put that it came with the shopping cart as a features i guess haven't seen the option to turn it off yet...

As far as the slideshow it works fine but sometimes it doesnt load properly and the numbers appear behind the image... no idea why?