oldmobie
10-22-2009, 05:38 PM
I'm trying to use several button images, arranged in a table, nested into a floating <div> to provide site navigation. All are working, except the one in my first <td>. I've tried moving them all around, and it's always the top one. I even tried putting the page logo in the top <td>, but it didn't even appear. Obviously I need help troubleshooting either my table, or it's relationship to the <div>. Below, I'll include the code for the <div> and table. Any help is appreciated!
<style TYPE="text/css">
BODY {Margin-Left: 175;}
</style>
<div id="floatdiv" style="
position:absolute;
width:155px;left:4px;top:4px;
padding:2px;background:#000000;>
<table>
<tr><td><A HREF="location.html"><IMG SRC="buttons\location.png"
ALT="Location and Hours" BORDER=0></A></td></tr>
<tr><td><A HREF="pricing.html"><IMG SRC="buttons\pricing.png"
ALT="Pricing" BORDER=0></A></td></tr>
<tr><td><A HREF="contact.html"><IMG SRC="buttons\contact.png"
ALT="Contact Information" BORDER=0></A></td></tr>
<tr><td><A HREF="nailart.html"><IMG SRC="buttons\nailart.png"
ALT="Nail Art Pictures" BORDER=0></A></td></tr>
<tr><td><A HREF="meetcathy.html"><IMG SRC="buttons\meetcathy.png"
ALT="Meet Cathy" BORDER=0></A></td></tr>
<tr><td><IMG width=150px SRC="4one7_Nails.BMP" ALT="4one7
Nails" BORDER=0></td></tr>
</table>
</div>
<SCRIPT TYPE="text/javascript"><!--
/* Script by: www.jtricks.com
* Version: 20060303
* Latest version:
* www.jtricks.com/javascript/navigation/floating.html
*/
var target_x = 4;
var target_y = 20;
var has_inner = typeof(window.innerWidth) == 'number';
var has_element = document.documentElement && document.documentElement.clientWidth;
var fm_id='floatdiv';
var floating_menu =
document.getElementById
? document.getElementById(fm_id)
: document.all
? document.all[fm_id]
: document.layers[fm_id];
var fm_shift_x, fm_shift_y, fm_next_x, fm_next_y;
function move_menu()
{
if (document.layers)
{
floating_menu.left = fm_next_x;
floating_menu.top = fm_next_y;
}
else
{
floating_menu.style.left = fm_next_x + 'px';
floating_menu.style.top = fm_next_y + 'px';
}
}
function compute_shifts()
{
fm_shift_x = has_inner
? pageXOffset
: has_element
? document.documentElement.scrollLeft
: document.body.scrollLeft;
if (target_x < 0)
fm_shift_x += has_inner
? window.innerWidth
: has_element
? document.documentElement.clientWidth
: document.body.clientWidth;
fm_shift_y = has_inner
? pageYOffset
: has_element
? document.documentElement.scrollTop
: document.body.scrollTop;
if (target_y < 0)
fm_shift_y += has_inner
? window.innerHeight
: has_element
? document.documentElement.clientHeight
: document.body.clientHeight;
}
function float_menu()
{
var step_x, step_y;
compute_shifts();
step_x = (fm_shift_x + target_x - fm_next_x) * .07;
if (Math.abs(step_x) < .5)
step_x = fm_shift_x + target_x - fm_next_x;
step_y = (fm_shift_y + target_y - fm_next_y) * .07;
if (Math.abs(step_y) < .5)
step_y = fm_shift_y + target_y - fm_next_y;
if (Math.abs(step_x) > 0 ||
Math.abs(step_y) > 0)
{
fm_next_x += step_x;
fm_next_y += step_y;
move_menu();
}
setTimeout('float_menu()', 20);
};
compute_shifts();
if (document.layers)
{
// Netscape 4 cannot perform init move
// when the page loads.
fm_next_x = 0;
fm_next_y = 0;
}
else
{
fm_next_x = fm_shift_x + target_x;
fm_next_y = fm_shift_y + target_y;
move_menu();
}
float_menu();
//--></SCRIPT>
<style TYPE="text/css">
BODY {Margin-Left: 175;}
</style>
<div id="floatdiv" style="
position:absolute;
width:155px;left:4px;top:4px;
padding:2px;background:#000000;>
<table>
<tr><td><A HREF="location.html"><IMG SRC="buttons\location.png"
ALT="Location and Hours" BORDER=0></A></td></tr>
<tr><td><A HREF="pricing.html"><IMG SRC="buttons\pricing.png"
ALT="Pricing" BORDER=0></A></td></tr>
<tr><td><A HREF="contact.html"><IMG SRC="buttons\contact.png"
ALT="Contact Information" BORDER=0></A></td></tr>
<tr><td><A HREF="nailart.html"><IMG SRC="buttons\nailart.png"
ALT="Nail Art Pictures" BORDER=0></A></td></tr>
<tr><td><A HREF="meetcathy.html"><IMG SRC="buttons\meetcathy.png"
ALT="Meet Cathy" BORDER=0></A></td></tr>
<tr><td><IMG width=150px SRC="4one7_Nails.BMP" ALT="4one7
Nails" BORDER=0></td></tr>
</table>
</div>
<SCRIPT TYPE="text/javascript"><!--
/* Script by: www.jtricks.com
* Version: 20060303
* Latest version:
* www.jtricks.com/javascript/navigation/floating.html
*/
var target_x = 4;
var target_y = 20;
var has_inner = typeof(window.innerWidth) == 'number';
var has_element = document.documentElement && document.documentElement.clientWidth;
var fm_id='floatdiv';
var floating_menu =
document.getElementById
? document.getElementById(fm_id)
: document.all
? document.all[fm_id]
: document.layers[fm_id];
var fm_shift_x, fm_shift_y, fm_next_x, fm_next_y;
function move_menu()
{
if (document.layers)
{
floating_menu.left = fm_next_x;
floating_menu.top = fm_next_y;
}
else
{
floating_menu.style.left = fm_next_x + 'px';
floating_menu.style.top = fm_next_y + 'px';
}
}
function compute_shifts()
{
fm_shift_x = has_inner
? pageXOffset
: has_element
? document.documentElement.scrollLeft
: document.body.scrollLeft;
if (target_x < 0)
fm_shift_x += has_inner
? window.innerWidth
: has_element
? document.documentElement.clientWidth
: document.body.clientWidth;
fm_shift_y = has_inner
? pageYOffset
: has_element
? document.documentElement.scrollTop
: document.body.scrollTop;
if (target_y < 0)
fm_shift_y += has_inner
? window.innerHeight
: has_element
? document.documentElement.clientHeight
: document.body.clientHeight;
}
function float_menu()
{
var step_x, step_y;
compute_shifts();
step_x = (fm_shift_x + target_x - fm_next_x) * .07;
if (Math.abs(step_x) < .5)
step_x = fm_shift_x + target_x - fm_next_x;
step_y = (fm_shift_y + target_y - fm_next_y) * .07;
if (Math.abs(step_y) < .5)
step_y = fm_shift_y + target_y - fm_next_y;
if (Math.abs(step_x) > 0 ||
Math.abs(step_y) > 0)
{
fm_next_x += step_x;
fm_next_y += step_y;
move_menu();
}
setTimeout('float_menu()', 20);
};
compute_shifts();
if (document.layers)
{
// Netscape 4 cannot perform init move
// when the page loads.
fm_next_x = 0;
fm_next_y = 0;
}
else
{
fm_next_x = fm_shift_x + target_x;
fm_next_y = fm_shift_y + target_y;
move_menu();
}
float_menu();
//--></SCRIPT>