Multiple slideshows in a table on one page
I am trying to get a slideshow to fit correctly in a table. I am new to jquery. I want to fit it within cells of the table. I have tried to adjust the slideshow "li" attribute but can't get it to work. Please help me to achieve this. Here is my code,
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>main.html</title>
<script type="text/javascript" src="jquery1.2.6.min.js"></script>
<script src="jquery.slideshow.js"></script>
<style>
.slideshow { position: relative;}
.slideshow li { position: absolute; top: 0; width: 310px; height: 86px; display: table-cell; list-style: none; }
.slideshow li:first-child { display: block; }
.slideshow-2 { top: 0px; }
</style>
<script>
document.documentElement.className += 'js';
</script>
<script>
$(function() {
$('.slideshow').slideshow({ timeout: 2000, speed: 1000 });
});</script>
</head>
<body background="images/bg-image1.jpg">
<table align="center" cellpadding="0" cellspacing="0" border="0" width="990">
<tr>
<tr>
<td><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="
http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="990" height="461">
<param name="movie" value="images/center.swf">
<param name="quality" value="high">
<param name="wmode" value="transparent">
<embed src="images/center.swf" quality="high" pluginspage="
http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" wmode="transparent" type="application/x-shockwave-flash" width="990" height="461"></embed>
</object></td>
</tr>
</table>
<table align="center" cellpadding="0" cellspacing="0" border="0" width="990" height="330" background="images/bg-image1.jpg">
<tr>
<td valign="middle" width="330" background="images/Blue-Rounded-Box.gif" style="font-family:Verdana, Geneva, sans-serif; height:300px" colspan="1" rowspan="1">
<p align="center" style="font-size:18px; font-weight:bold">Welcome to EZ Way Auto | Dallas Used Cars</p>
<p align="center" style="font-size:13px">If you're looking for <b>your next auto</b>, or <br />want to <b>sell your vehicle </b>we can help!</p>
<p align="center" style="font-size:13px">We offer in house <strong>Buy Here, Pay Here</strong> <br />and <strong>Third Party</strong> auto financing.<br /></p>
<p align="center"><font style="font-size:11px">11222 Ables Lane<br />Dallas, TX 75229</font><br /><b><font size="4">(972)620-9020</font></b></p>
<p align="center" style="font-size:13px">
ezwayauto@aol.com></p>
<p align="center"><font style="font-size:11px">3716 N. State Hwy 91<br />Denison, TX 75020</font><br /><b><font size="4">(903)463-3094</font></b></p></td>
<td valign="top" width="660" background="images/Blue-Rounded-Box1.gif" colspan="2" rowspan="1">
<p align="center" style="font-size:24px; font-weight:bold; font-family:Verdana, Geneva, sans-serif">Featured Inventory</p>
<table id="slideshow" align="center" cellpadding="0" cellspacing="0" border="0" width="660">
<tr>
<td align="center" width="320">
<ul class="slideshow">
<li><img src="images/00accord.jpg" height="86" width="310"></li>
<li><img src="images/00grandprix.jpg" height="86" width="310"></li>
<li><img src="images/00mercedes.jpg" height="86" width="310"></li>
<li><img src="images/01cadillac.jpg" height="86" width="310"></li>
<li><img src="images/01century.jpg" height="86" width="310" /></li>
<li><img src="images/01ptcruiser.jpg" height="86" width="310" /></li>
</ul>
</td>
<td align="center" width="320">
<ul class="slideshow slideshow-2">
<li><img src="images/01ram.jpg" height="86" width="310"></li>
<li><img src="images/02mazda.jpg" height="86" width="310"></li>
<li><img src="images/03nissan.jpg" height="86" width="310"></li>
<li><img src="images/03stratus.jpg" height="86" width="310"></li>
<li><img src="images/03stratusrt.jpg" height="86" width="310" /></li>
<li><img src="images/05sebring.jpg" height="86" width="310" /></li>
</ul>
</td>
</tr>
</table>
</td></tr>
</table>
</body>
</html>