PDA

View Full Version : Top Nav Bar I - Gets covered by other applets when scrolls

rmanning
10-22-2002, 07:09 PM
Hi -

I've installed Top Nav Bar I v2 (aka SmartMenu 2).

Works just great, BUT...

I also have some other JavaSCript applets (news scroller & banner) near the top of the page. These are in table cells.

When the menu drops down, the lower items disappear behind the other applets :mad:

When the Nav bar moves down the page due to scrolling it goes behind the other applets as well - not pretty.

I guess this is due to the order the applets are loaded - last applet on top. Is there a way to have the nav bar always remain on top? I've tried to find some info on z-index, but to no avail.

HTML Code fragment below.

Thanks for any solutions!

Ross.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta http-equiv="Content-Language" content="en-us">
<title>Home</title>
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">

<style>
<!--
h2 { font-family: Trebuchet MS }
-->
</style>

<script language="JavaScript">

//Top Nav Bar I v2- By Constantin Kuznetsov Jr. (script@esolutiononline.com)
//Modified by Dynamic Drive for NS6/Opera6 compatibility and code streamlining March 4th, 2002
//Visit http://www.dynamicdrive.com for this script

var keepstatic=1 //specify whether menu should stay static (works only in IE4+)
var menucolor="#000000" //specify menu color
var submenuwidth=150 //specify sub menus' color

</script>

<style>
all.clsMenuItemNS, .clsMenuItemIE{text-decoration: none; font: bold 12px Arial; color: white; cursor: hand; z-index:100}
#MainTable A:hover {color: lightblue;}
</style>


</head>
<body marginwidth="0" marginheight="0" leftmargin="0" topmargin="0">
<script language="JavaScript" src="scripts/menu.js"></script>
<script language="JavaScript" src="scripts/menucontext.js"></script>
<script language="JavaScript">
showToolbar();
</script>
<script language="JavaScript">
function UpdateIt(){
if (ie&&keepstatic&&!opr6)
document.all["MainTable"].style.top = document.body.scrollTop;
setTimeout("UpdateIt()", 200);
}
UpdateIt();
</script>

<div align="left">
<table border="0" width="775" height="141">
<tr>
<td width="771" height="141">
</td>
<td width="740" height="141" colspan="2"><font face="Trebuchet MS" size="7"><font color="#006699"><i>Connect</i></font><i>Home<br>
</i></font>
<font FACE="Trebuchet MS"><b>Residential&nbsp; Networking&nbsp;
&amp;&nbsp; Automation</b></font>
<p>
<applet Code=apMagicMenu.class Archive=scripts/apMagicMenu.jar Width=732 Height=80>
<param name="backColor" value="006699">
<param name="backWords" value="
Home Automation,Energy Management,Home Entertainment,Home Computer Networking,Lighting Control,Audio/Video Distribution,Home Security,Structured Wiring,Whole-House High Speed Internet">
<param name="brightness" value="6">
<param name="Copyright" value="Apycom Software - www.apycom.com">
<param name="fadeDelay" value="20">
<param name="fadeSteps" value="90">
<param name="isHorizontal" value="false">
<param name="fadeType" value="0">
<param name="maxWords" value="12">
<param name="fontHighColor" value="ffffff">
<param name="font" value="Arial,14,1">
<param name="fontColor" value="CCFFFF">
<param name="menuItems" value="{ ,testlink.html,_self}">
</applet>
</p>
</td>
</tr>
<tr>
<td width="168" height="141">

</td>
<td width="137" height="141">

<applet code=NewsTicker.class
name=NewsTicker
width=120
height=151 >
<param name="background" value="news.jpg">
<param name=x value=10>
<param name=y value=25>
<param name=cx value=90>
<param name=cy value=114>
<param name="newsfile" value="news.txt">
<param name=bgcolor value="102,102,153">
<param name=pause value="true">
</applet>

</td>
beetle
10-22-2002, 07:17 PM
sorry, but I'm afraid your efforts will be in vain

Why what you are doing won't work (http://www.webreference.com/dhtml/diner/seethru/indexNEW.html)

Page 4 or 5 has the details on java applets, but I recommend reading the whole article...
rmanning
10-22-2002, 11:25 PM
Oh, well. Back to the drawing board with my design.

Thanks for your help - at least it will save me from more fruitless research trying to solve an insoluble problem!
Gordo
10-23-2002, 12:37 AM
Just a helpful hint...

It would be preferred that you use the Dynamic Drive scripts help forum (a sub menu to this JavaScript forum) next time when your query involves a DD script.

It's not a big deal, but those who've worked with the DD scripts such as this menu will most likely be able to help you more and/or quicker. In this large JavaScript forum, your post can become buried very quickly, and not everyone will read every new post here.

Like I said...next time. This thread is now done for the most part.

Good luck...
beetle
10-23-2002, 12:44 AM
Gordo...disagree.

manning is NOT having trouble with getting the menu to function correctly, but rather having it work in synergy with java applets that are also on his page. This is a general problem with absolutely-positioned content and controls that override the z-index of any such content.

It is merely happenstance in this case that manning's menu is one from dynamic drive. Indeed, this problem has nothing directly to do with menus at all.

Next time, YOU make sure you are familiar with the context of the post before handing out critiques such as this.

No harm, No foul. Take care :D