westminsterit
asked on
trying to create a site using thickbox to popup an image
i am trying to build a website using dreanweaver cs3
i want to create a pop up image using thick box
i am looking for a step by step guide
i have tryed the main site but i cant seam to make it work
i want to create a pop up image using thick box
i am looking for a step by step guide
i have tryed the main site but i cant seam to make it work
head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Untitled Document</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
<style type="text/css" media="all">
<!--
@import url("../js/thickbox.css");
-->
</style>
<link href="js/thickbox.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table width="983" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutDefaultTable-->
<tr>
<td width="20" height="63"> </td>
<td width="262"> </td>
<td width="30"> </td>
<td width="671" rowspan="3" valign="top"><div align="center"><img src="images/WVLogo.jpg" width="347" height="168" /></div></td>
</tr>
<tr>
<td height="36"> </td>
<td valign="top"><a href="mailto:rsmith@wvsf.us" class="link">Make an Appointment</a></td>
<td> </td>
</tr>
<tr>
<td height="69"> </td>
<td> </td>
<td> </td>
</tr>
</table>
<div class="big">
<table width="577" height="375" border="0" align="center" cellpadding="0" cellspacing="10">
<!--DWLayoutDefaultTable-->
<tr>
<td width="142"><img src="images/Dr. Phillips & Maggie sitting.jpg" alt="" name="test" width="232" height="232" class="box1" id="test" /></td>
<td width="145"> </td>
<td width="146"><a href="foog.php"><img src="images/Chef Breck at 2004 Fall Food Fest.JPG" width="240" height="232" class="box1" /></a></td>
</tr>
<tr>
<td><img src="images/WV Foundation Golf Photo.JPG" width="232" height="232" class="box1" /></td>
<td> </td>
<td><a href="dog.htm?height=200&width=200" title="" class="thickbox"><img src="images/Walking the Dog.jpg" width="232" height="232" class="box1" /></a></td>
</tr>
<tr>
<td><img src="images/2007 Easter Egg 012.jpg" width="232" height="232" class="box1" /></td>
<td> </td>
<td><img src="images/2007 Mardi Gras 010.jpg" width="232" height="232" class="box1" /></td>
</tr>
</table>
</div>
</body>
</html>
ASKER
here is the revised code
after making the change i am still haveing turbble
can you see what am i doing wrong?
after making the change i am still haveing turbble
can you see what am i doing wrong?
<!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>
<script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/thickbox.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Untitled Document</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
<style type="text/css" media="all">
<!--
@import url("../js/thickbox.css");
-->
</style>
<link href="js/thickbox.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="big"><table width="577" height="375" border="0" align="center" cellpadding="0" cellspacing="10"><tr><td width="142"><table width="983" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutDefaultTable-->
<tr>
<td width="20" height="63"> </td>
<td width="262"> </td>
<td width="30"> </td>
<td width="671" rowspan="3" valign="top"><div align="center"><img src="images/WVLogo.jpg" width="347" height="168" /></div></td>
</tr>
<tr>
<td height="36"> </td>
<td valign="top"><a href="mailto:rsmith@wvsf.us" class="link">Make an Appointment</a></td>
<td> </td>
</tr>
<tr>
<td height="69"> </td>
<td> </td>
<td> </td>
</tr>
</table>
<div class="big">
<table width="577" height="375" border="0" align="center" cellpadding="0" cellspacing="10">
<!--DWLayoutDefaultTable-->
<tr>
<td width="142"><img src="images/Dr. Phillips & Maggie sitting.jpg" alt="" name="test" width="232" height="232" class="box1" id="test" /></td>
<td width="145"> </td>
<td width="146"><a href="foog.php"><img src="images/Chef Breck at 2004 Fall Food Fest.JPG" width="240" height="232" class="box1" /></a></td>
</tr>
<tr>
<td><img src="images/WV Foundation Golf Photo.JPG" width="232" height="232" class="box1" /></td>
<td> </td>
<td><a href="dog.htm?height=200&width=200" title="" class="thickbox"><img src="images/Walking the Dog.jpg" width="232" height="232" class="box1" /></a></td>
</tr>
<tr>
<td><img src="images/2007 Easter Egg 012.jpg" width="232" height="232" class="box1" /></td>
<td> </td>
<td><img src="images/2007 Mardi Gras 010.jpg" width="232" height="232" class="box1" /></td>
</tr>
</table>
</div></td>
</tr>
</table>
</div>
</body>
</html>
Are the files in the right places?
It works in this example where I changed the files to point at the jquery site (you should not do that in real life)
testthickbox.txt
It works in this example where I changed the files to point at the jquery site (you should not do that in real life)
testthickbox.txt
ASKER
they are in the js folder in the root of the site.
ASKER
ok i found the problem the file name was wrong in the js script
but now it seems to be displaing in the lower left hand corner of the screen and not in the middle of the browser window
but now it seems to be displaing in the lower left hand corner of the screen and not in the middle of the browser window
That is a missing CSS file
ASKER
on the target html page ?
or did i not download everything i needed ?
or did i not download everything i needed ?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
i have that placed in the same file
<script type="text/javascript" src="path-to-file/jquery.j
<script type="text/javascript" src="path-to-file/thickbox
as detailed here:
http://jquery.com/demo/thickbox/