hey everybody.

i am trying to build a gallery with dynamic layers and some rollover business, but have trouble getting the layer INSIDE my table cell.

anybody has ideas?

You can see the code at

http://www.luxdesign.com/blvd/gallery.html

The big picture is the BG pic of the layer and is supposed to line up with all of the little squares that are in a table and they will be the navigation.

thank you.

Hi there,

You position the image here:

left:495px; top:314px; width:222px; height:239px;

which is exactly where it ends up. However, it's the starting point that may be confusing you. The 0,0 coordinate is the top left pixel of the browser's window, not the other content in the site.

Why are you trying to solve this with layers? If you already have so many tables, you might as well add another cell for this image. Or am I overlooking something?

Imar
---------------------------------------
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Everyone is unique, except for me.
Author of ASP.NET 2.0 Instant Results and Beginning Dreamweaver MX / MX 2004
Want to be my colleague? Then check out this post.

hey imar,

i tried specifying the position like that, but unfortunately they don't align in Firefox and Safari -if it lines up in one of them it's a few pixels of in the other and vice versa.

Also I want to make these dynamic layers, the small images will be rollovers and if you click them the corresponding big image will appear. The only way I found for this to work in html is dynamic layers.

So I am trying to put the layer in the table cell for everything to line up. Can you think of a better sollution?


Thank you,
Katharina

Hi Katharina,

You should start by adding a proper doc type to your page. Without a doc type, you'll find the differences between all browsers much bigger.

With a doctype like transitional XHTML 1.0, IE and FireFox will render much closer to each other.

For more details, see this article:

http://www.alistapart.com/articles/doctype/

Once you have a doctype, you can start writing valid code that will render the same in all major browsers.

You may also want to take a look at a book like Beginning CSS as it'll help you understand how to build site using XHTML and CSS.

Cheers,

Imar


---------------------------------------
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Everyone is unique, except for me.
Author of ASP.NET 2.0 Instant Results and Beginning Dreamweaver MX / MX 2004
Want to be my colleague? Then check out this post.

Thanks Imar,

I will look into that.

Kat

The doctype makes everything a bit more regular, but my problem still isn't solved.

Even is the image lines up with the table, if i resize the browser window (or if somebody has a smaller bigger screen than me) it's in the wrong spot.

Correct. Like I said earlier, you positioned the image in a fixed location, with the browser window's (0, 0) coordinate (the upper left hand corner) being the anchor point.

So, when you resize the browser, the image will stay put, but the rest of the content will move.

Instead, you could embed the image directly inside another table cell (I didn't really understand your explanation why you couldn't; you don't need a positioned image to create a roll-over) or look into other positioning options: http://www.w3schools.com/css/pr_class_position.asp

Cheers,

Imar
---------------------------------------
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Everyone is unique, except for me.
Author of ASP.NET 2.0 Instant Results and Beginning Dreamweaver MX / MX 2004
Want to be my colleague? Then check out this post.

Hey Imar,

I figured it out. I just put the image in the table and create a rollover through swaping the image. I will re-upload the site as soon as I am done so that you can see.

I had to take out the doctype because it disabled my swap image command.

Maybe i just had the wrong doctype?

Is there anything else in my site that you see that needs changing? I am self-taught and i just pretty much figure things out as i go along so i have no idea if what i am doing is right. I appreciate any input.

Thank you.

That largely depends on whether you want to change it or not, and have the time to learn what to change.

Currently, your site looks good (although I do get a JavaScript error popping up on every page). However, it uses a lot of code, and also a bit out-dated code, and way too much JavaScript. Depending on your intentions with the site, this is not a problem. It looks good, works fine, so why bother changing it.

However, if you want to build a site that remains easy to maintain now, and two years from now, you may want to a look at XHTML, CSS and DocTypes a little more. Those are important concepts to create fast rendering, easy to maintain and cross browser web sites. I haven't tried it, but I think I can rewrite your frontpage to only 30% of the current code, dropping 70% of the code, and thus wasted bandwidth....

But again, you have to consider for yourself if that's what you want. If it ain't broken, don't fix it.... ;)

Imar
---------------------------------------
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Everyone is unique, except for me.
Author of ASP.NET 2.0 Instant Results and Beginning Dreamweaver MX / MX 2004
Want to be my colleague? Then check out this post.

hey imar,

you get an error message?
that's not good. i would definately like to get rid of that. i honestly didn't know i was using a whole lot of java script. where is it?

i also don't want to chane a lot, leave alone start over or anything crazy like that, but i would like to work on making it more efficient and faster to load.

what are some easy things i can do to slim it down a bit?

thank you.