Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Having problems with a script

Status
Not open for further replies.
sfmonki

sfmonki

Programmer
Aug 6, 2007
3
US
I've written the following script to create a tabbed pane of jpgs.

Problem is - when I use it more than once on the same page - it breaks 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.

<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>

<script type="text/javascript">
function swchart(is)
{

divs = document.getElementsByTagName("div");
for (i = 0; i < divs.length; i++)
{
div = divs;
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>
<HTML>
<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>
</HTML>
 
Sort by date Sort by votes
<script type="text/javascript">
function swchart(is)
{

divs = document.getElementsByTagName("div");
for (i = 0; i < divs.length; i++)
{
div = divs;
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>
 
Upvote 0 Downvote
the html is in place - i only posted the elements of my page that are at issue with the script
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
1K
Mike Lewis
Mike Lewis
MDGarcia
  • Locked
  • Question
Java script blocked due to MIME type error
Replies
2
Views
940
MDGarcia
MDGarcia
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
633
malpa
malpa
markronz
  • Locked
  • Question
Javascript to edit all script tags 1
Replies
2
Views
189
feherke
feherke
TheLazyPig
  • Question
Buttons not aligned after another button is clicked
Replies
2
Views
173
gmmastros
gmmastros

Part and Inventory Search

Sponsor

Back
Top