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!

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

Problem with Layers & Divs

Status
Not open for further replies.

ID10T16

Technical User
Sep 22, 2000
160
US
Here is my Code:

<html>
<head>
<style>
<!--

#slidemenubar, #slidemenubar2{
position:absolute;
left:10px;
height:200px;
width:200px;
top:150px;
border:0;
background-color:green;
font:bold 12px Verdana;}
-->
</style>


<script>
<!--
var g_images = new Array();
g_images[0] = new Image();
g_images[0].src = &quot;News1.gif&quot;;
g_images[1] = new Image();
g_images[1].src = &quot;News2.gif&quot;;
g_images[2] = new Image();
g_images[2].src = &quot;AdminButton1.gif&quot;;
g_images[3] = new Image();
g_images[3].src = &quot;AdminButton2.gif&quot;;
g_images[4] = new Image();
g_images[4].src = &quot;Links1.gif&quot;;
g_images[5] = new Image();
g_images[5].src = &quot;Links2.gif&quot;;
g_images[6] = new Image();
g_images[6].src = &quot;Home1.gif&quot;;
g_images[7] = new Image();
g_images[7].src = &quot;Home2.gif&quot;;
function imgRotate(nIndex){
if ( g_images[0].complete)
document.images[1].src = g_images[nIndex].src;}
function imgRotate2(nIndex){
if ( g_images[2].complete)
document.images[3].src = g_images[nIndex].src;}
function imgRotate3(nIndex){
if ( g_images[4].complete)
document.images[5].src = g_images[nIndex].src;}
function imgRotate4(nIndex){
if ( g_images[6].complete)
document.images[7].src = g_images[nIndex].src;}
//-->
</SCRIPT>
</head>

<body>
<script language=&quot;JavaScript1.2&quot;>
<!--
if (document.all)
document.write('<div id=&quot;slidemenubar&quot; style=&quot;left:10&quot; onMouseout=&quot;draw()&quot; onMouseover=&quot;pull()&quot;>
//--></script>
<layer id=&quot;slidemenubar2&quot; onMouseover=&quot;pull()&quot; onMouseout=&quot;draw()&quot;>
<a href=&quot;#&quot; onmousedown=&quot;imgRotate(1)&quot;; onmouseup=&quot;imgRotate(0)&quot;><img src=&quot;Info1.gif&quot; border=&quot;0&quot; height=&quot;50&quot; width=&quot;200&quot;/></a></br>
<a href=&quot;#&quot; onmousedown=&quot;imgRotate2(3)&quot;; onmouseup=&quot;imgRotate2(2)&quot;><img src=&quot;News1.gif&quot; border=&quot;0&quot; height=&quot;50&quot; width=&quot;200&quot;/></a></br>
<a href=&quot;#&quot; onmousedown=&quot;imgRotate3(5)&quot;; onmouseup=&quot;imgRotate3(4)&quot;><img src=&quot;AdminButton1.gif&quot; border=&quot;0&quot; height=&quot;50&quot; width=&quot;200&quot;/></a></br>
<a href=&quot;#&quot; onmousedown=&quot;imgRotate4(7)&quot;; onmouseup=&quot;imgRotate4(6)&quot;><img src=&quot;Links1.gif&quot; border=&quot;0&quot; height=&quot;50&quot; width=&quot;200&quot;/></a></br>
</layer>

<script language=&quot;JavaScript1.2&quot;>
function regenerate(){
window.location.reload()
}
function regenerate2(){
if (document.layers)
setTimeout(&quot;window.onresize=regenerate&quot;,400)
}
window.onload=regenerate2
if (document.all){
document.write('</div>')
themenu=document.all.slidemenubar2.style
rightboundary=0
leftboundary=-173
}
else{
themenu=document.layers.slidemenubar
rightboundary=173
leftboundary=10
}

function pull(){
if (window.drawit)
clearInterval(drawit)
pullit=setInterval(&quot;pullengine()&quot;,50)
}
function draw(){
clearInterval(pullit)
drawit=setInterval(&quot;drawengine()&quot;,30)
}
function pullengine(){
if (document.all&amp;&amp;themenu.pixelLeft<rightboundary)
themenu.pixelLeft+=20
else if(document.layers&amp;&amp;themenu.left<rightboundary)
themenu.left+=20
else if (window.pullit)
clearInterval(pullit)
}
function drawengine(){
if (document.all&amp;&amp;themenu.pixelLeft>leftboundary)
themenu.pixelLeft-=5
else if(document.layers&amp;&amp;themenu.left>leftboundary)
themenu.left-=5
else if (window.drawit)
clearInterval(drawit)
}
</script>
</body>
</html>
:



Now, I get an error mesage that says, &quot;Line 58, Char 97, Error Unterminated String Constant&quot;. I have NO clue what is going on, can anyone help. I'm also having some problems w/ the images. When I initate the rollover the first link, it changes the image under it. &amp; the last two images give me this message &quot;document.images.5&quot; is null or not an object. Am I using too many rollovers? I would appreciate any helpful insight anyone can offer on this.

 
Wow, that's kinda long. I got the Dynamic HTML part to work, but I am still having trouble w/ the images. The imgRotate function works for the following image, not the one clicked. It's a pain.
 
Could you please clarify? Has this been answered by thr thread in the JavaScript forum already?
-Ben &quot;Alright whatever man, I'll hook up the hair, but I aint touchin the ring...Cause I'm still a pla--yer&quot;
 
This i believe to be your problem, on line 58
document.write('<div id=&quot;slidemenubar&quot; style=&quot;left:10&quot; onMouseout=&quot;draw()&quot; onMouseover=&quot;pull()&quot; >

should be
document.write('<div id=&quot;slidemenubar&quot; style=&quot;left:10&quot; onMouseout=&quot;draw()&quot; onMouseover=&quot;pull()&quot; ' >

You forgot to put the ending ' at the end of the tag
Complied again and it ran fine in IE, use Netscape to find the little bugs, has a better debugger than IE. You also do this //--> I don't believe that is a valid line of code

hope it helps......
 
Yep that fixed it. Thank you ackka. &amp; yes banger this same thing is posted in the Javascript forum, only in refferal to a different problem. The javascript post reffers to proloaded image swapping.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top