Menu
Can anyone help me resolve a javascript problem?
I have a script which creates a tabbed pane of jpgs from a directory on my server. This works perfectly when used once on a page.
When I use it more than once on the same page – its breaking the display. mousing over one of the 2nd or 3rd instances removes the other instances from display.
Each reference calls on a different directory for its images.
Many thanks for any input.
Below is the associated code.
[B]The Style
[CODE]<style type=”text/css”>
.az1 {background-image:url(../../images/chart_files/strategies/BgImgs/az1.jpg);
background-repeat:no-repeat;
height:16px;}
.az2 {background-image:url(../../images/chart_files/strategies/BgImgs/az2.jpg);
background-repeat:no-repeat;
height:16px;}
.show
{display: block;}
.hidden
{display: none;}
</style>
[B]The Script
[CODE]<script type=”text/javascript”>
function swchart(is)
{
divs = document.getElementsByTagName(“div”);
for (i = 0; i < divs.length; i++)
{
div = divs[i];
if (div.className == ‘show’)
{
div.className = ‘hidden’;
divn = div;
}
}
document.getElementById(is).className = “show”;
document.getElementById(“d”+is).className = “az1”;
document.getElementById(“d”+divn.id).className = “az2”;
}
</script>
[B]In the body of my html
[CODE]<div style=”height:20px;”><!– –></div><div align=”center”>
<table align=”center” cellpadding=”0″ cellspacing=”0″>
<tr height=”18px”>
<?php
$ct=0;
if ($handle = opendir(‘././images/chart_files/strategies/tab_1’)) {
while (false !== ($file = readdir($handle))) {
if ($file != “.” && $file != “..”)
{ $ct = $ct + 1;
if ($ct == 1)
{ echo “<td align=’center’ width=’70px’ style=’color:#FFFFFF’><div align=’center’ class=’az1′ id=’d$file’><a style=’font-family:Arial, Helvetica, sans-serif; font-size:120%; color:#ffffff;’ href=”;}
else
{echo “<td align=’center’ width=’70px’ style=’color:#FFFFFF’><div align=’center’ class=’az2′ id=’d$file’><a style=’font-family:Arial, Helvetica, sans-serif; font-size:120%; color:#ffffff;’ href=”;}
$file2 = substr_replace($file,””,-4);
echo ‘”‘;
echo ‘#’;
echo ‘”‘;
echo ” onMouseOver=”;
echo ‘”‘;
echo “swchart(‘”;
echo “$file'”;
echo “);”;
echo ‘”‘;
echo “>”;
echo “$file2”;
echo “</a></div></td><td width=’3px’></td>”;
}
}
closedir($handle);
}
?>
</tr></table>
</div>
<?php
$ct=0;
if ($handle = opendir(‘././images/chart_files/strategies/tab_1’)) {
while (false !== ($file = readdir($handle))) {
if ($file != “.” && $file != “..”) {
$ct = $ct + 1;
if ($ct == 1)
{ echo “<div class=’show’ align=’center’ id='”;}
else
{echo “<div class=’hidden’ align=’center’ id='”;}
echo “$file'”;
echo “>”;
echo “<img src=’../../images/chart_files/strategies/tab_1/”;
echo “$file”;
echo “‘></div>”;
}
}
closedir($handle);
}
?>
<div style=”height:20px;”><!– –></div><div align=”center”>
<table align=”center” cellpadding=”0″ cellspacing=”0″>
<tr height=”18px”>
<?php
$ct=0;
if ($handle = opendir(‘././images/chart_files/strategies/tab_2’)) {
while (false !== ($file = readdir($handle))) {
if ($file != “.” && $file != “..”)
{ $ct = $ct + 1;
if ($ct == 1)
{ echo “<td align=’center’ width=’70px’ style=’color:#FFFFFF’><div align=’center’ class=’az1′ id=’d$file’><a style=’font-family:Arial, Helvetica, sans-serif; font-size:120%; color:#ffffff;’ href=”;}
else
{echo “<td align=’center’ width=’70px’ style=’color:#FFFFFF’><div align=’center’ class=’az2′ id=’d$file’><a style=’font-family:Arial, Helvetica, sans-serif; font-size:120%; color:#ffffff;’ href=”;}
$file2 = substr_replace($file,””,-4);
echo ‘”‘;
echo ‘#’;
echo ‘”‘;
echo ” onMouseOver=”;
echo ‘”‘;
echo “swchart(‘”;
echo “$file'”;
echo “);”;
echo ‘”‘;
echo “>”;
echo “$file2”;
echo “</a></div></td><td width=’3px’></td>”;
}
}
closedir($handle);
}
?>
</tr></table>
</div>
<?php
$ct=0;
if ($handle = opendir(‘././images/chart_files/strategies/tab_2’)) {
while (false !== ($file = readdir($handle))) {
if ($file != “.” && $file != “..”) {
$ct = $ct + 1;
if ($ct == 1)
{ echo “<div class=’show’ align=’center’ id='”;}
else
{echo “<div class=’hidden’ align=’center’ id='”;}
echo “$file'”;
echo “>”;
echo “<img src=’../../images/chart_files/strategies/tab_2/”;
echo “$file”;
echo “‘></div>”;
}
}
closedir($handle);
}
?>
<div style=”height:20px;”><!– –></div><div align=”center”>
<table align=”center” cellpadding=”0″ cellspacing=”0″>
<tr height=”18px”>
<?php
$ct=0;
if ($handle = opendir(‘././images/chart_files/strategies/tab_3’)) {
while (false !== ($file = readdir($handle))) {
if ($file != “.” && $file != “..”)
{ $ct = $ct + 1;
if ($ct == 1)
{ echo “<td align=’center’ width=’70px’ style=’color:#FFFFFF’><div align=’center’ class=’az1′ id=’d$file’><a style=’font-family:Arial, Helvetica, sans-serif; font-size:120%; color:#ffffff;’ href=”;}
else
{echo “<td align=’center’ width=’70px’ style=’color:#FFFFFF’><div align=’center’ class=’az2′ id=’d$file’><a style=’font-family:Arial, Helvetica, sans-serif; font-size:120%; color:#ffffff;’ href=”;}
$file2 = substr_replace($file,””,-4);
echo ‘”‘;
echo ‘#’;
echo ‘”‘;
echo ” onMouseOver=”;
echo ‘”‘;
echo “swchart(‘”;
echo “$file'”;
echo “);”;
echo ‘”‘;
echo “>”;
echo “$file2”;
echo “</a></div></td><td width=’3px’></td>”;
}
}
closedir($handle);
}
?>
</tr></table>
</div>
<?php
$ct=0;
if ($handle = opendir(‘././images/chart_files/strategies/tab_3’)) {
while (false !== ($file = readdir($handle))) {
if ($file != “.” && $file != “..”) {
$ct = $ct + 1;
if ($ct == 1)
{ echo “<div class=’show’ align=’center’ id='”;}
else
{echo “<div class=’hidden’ align=’center’ id='”;}
echo “$file'”;
echo “>”;
echo “<img src=’../../images/chart_files/strategies/tab_3/”;
echo “$file”;
echo “‘></div>”;
}
}
closedir($handle);
}
?>
<div style=”height:20px;”><!– –></div>