Closed Thread Icon

Preserved Topic: Problem with layers (Page 1 of 1) Pages that link to <a href="https://ozoneasylum.com/backlink?for=18478" title="Pages that link to Preserved Topic: Problem with layers (Page 1 of 1)" rel="nofollow" >Preserved Topic: Problem with layers <span class="small">(Page 1 of 1)</span>\

 
hyperbole
Paranoid (IV) Inmate

From: Madison, Indiana, USA
Insane since: Aug 2000

posted posted 11-18-2001 06:40

I'm starting to learn about using layers and have run into a problem. I would appreciate any help anyone can give me.

I want to create a page like this:

<BLOCKQUOTE><FONT face="Verdana, Arial">code:</font><HR><pre>

1 2
+-------------------+
3

InSiDeR
Maniac (V) Inmate

From: Oblivion
Insane since: Sep 2001

posted posted 11-18-2001 08:01

Uhh, well that was a wee-bit confusing, but I think you wanted 2 things.

1. To get the images in the correct spots.
2. To get the navigatin buttons active.

If you ever took algebra, and I am sure or atleast hope you have used the distributive property to isolate the veriable. Well the distributive property is like a method that would take a longer time but it is easier to do.

So what I do when I want my images aligned in specific spots is just use a <DIV> command for every specified image and not a style sheet in the <head> section.

I use

<div style="position:absolute;top:0px;left:0px;"><img src="URL.JPG"></div>

now just fool around with the 0's in the "top:0px" and "left:0px" parameters. Leaving both of them at 0px would result in your picture in the top left handed corner. Basically if I specified it as this

<div style="position:absolute;top:125px;left:0px;">

I would have my image 125 pixels from the absolute top and completely pressed against the left side of the page because of the "left:0px;" command.


As for the navigation buttons. I don't know what you ment exactly by active but I am guessing you wanted them linked seing as you have no <A HREF=""> tags anywhere in your script. Just go

<A HREF="URL"><img src="url.jpg"></a>

Like I said I am not sure what you ment when you said active but that will atleast get your buttons going some where.

hyperbole
Paranoid (IV) Inmate

From: Madison, Indiana, USA
Insane since: Aug 2000

posted posted 11-19-2001 02:54

I'm sorry the description is confusing. I'm not sure what I can do to make it clearer.

I tried to reduce the amount of code I put in my request so you wouldn't have as much to read through. If you want, I will post the actual page, but, I want to warn you it is huge (221 lines).

First, I am not having a problem getting the images where I need them. With the HTML I posted above, the images are overlaying exactly where I want them. The problem is that there is a huge blank space at the bottom of the page the size the images would be if they were placed one on top of another. I want to know how to get rid of this blank space.

Second, I do have <A HREF="URL"><IMG ... in the <TABLE>. I haven't shown them because I didn't want to clutter up the post with the details of the table. The problem is that when I display the page, the buttons show up, but when I move the cursor over the button, the cursor doesn't become a "hand" to indicate that the button is active. If I press on the button, nothing happens.

The buttons in positions 1,2, and 3 are linked to the same URLs as those in locations 6, 5, and 4 repectively. The buttons in position 1, 2, 3, and 4 work. Those in positions 5, and 6 do not work. It's almost like the browsers think one of the <DIV> sections is covering these two buttons and won't allow them to be active.




Emperor
Maniac (V) Mad Scientist with Finglongers

From: Cell 53, East Wing
Insane since: Jul 2001

posted posted 11-19-2001 15:45

hyberbole: It should be doable but rather than post all the code why not give us a link to a page where its set up - its often much easier to troubleshoot when you can see the page in front of you.

Emps


You're my wife now Dave

hyperbole
Paranoid (IV) Inmate

From: Madison, Indiana, USA
Insane since: Aug 2000

posted posted 11-19-2001 16:54

I loaded one of the pages here.

You will see that there is a huge space below the table that looks like the space where the overlayed images were origanally placed and then moved over the map.

Also note that you can click on the Commands Button, and the Left and Right Arrows at the top of the <TABLE> but can not click on the onse at the bottom of the <TABLE>

As I mentioned these pages are designed to be Distributed on CD so I have only uploaded one of the pages and its referenced pages and images.




[This message has been edited by hyperbole (edited 11-19-2001).]

hyperbole
Paranoid (IV) Inmate

From: Madison, Indiana, USA
Insane since: Aug 2000

posted posted 11-21-2001 22:24

I figured it out. Aparenlty having the three overlay <DIV>s inside the other <DIV> was causing the outer <DIV> to think it was much larger than it really was. Since it was an overlay, it was "on top" of the navigation buttons at the bottom and was keeping the browser from allowing them to be active when the cursor moved over them.

By moving the three inner <DIV>s out to the same level with the other <DIV> I solved both problems at once. Now the page displays as the right size and all my navigation buttons are active.

To repeat what I said in a different way:

I changed:

code:
<DIV ID="div1">
<IMG SRC="./image1.gif">
<DIV ID="div2">
<IMG SRC="./image2.gif">
</DIV>
<DIV ID="div3">
<IMG SRC="./imag3.gif">
</DIV>
<DIV ID="div4">
<IMG SRC="./image4.gif">
</DIV>
</DIV>



to

code:
<DIV ID="div1">
<IMG SRC="./image1.gif">
</DIV>
<DIV ID="div2">
<IMG SRC="./image2.gif">
</DIV>
<DIV ID="div3">
<IMG SRC="./imag3.gif">
</DIV>
<DIV ID="div4">
<IMG SRC="./image4.gif">
</DIV>




and the page works properly.


Thank you all for your help and suggestions.




« BackwardsOnwards »

Show Forum Drop Down Menu