🚀 go-pugleaf

RetroBBS NetNews Server

Inspired by RockSolid Light RIP Retro Guy

Thread View: adobe.golive.windows
15 messages
15 total messages Started by Beth_A_Edwards Tue, 24 Mar 2009 17:33
Placing a layer on top of a table
#211
Author: Beth_A_Edwards
Date: Tue, 24 Mar 2009 17:33
19 lines
2178 bytes
Hi,
Some background: I am working on updating my webpage. I have created the files in Photoshop CS2, and then created slices and rollovers in ImageReady so that when the user mouses over a smaller icon on the left side of the screen the image changes to reveal a larger version of the icon. I then took the site in to GoLive. In GoLive I added a "table" with 1 row and 1 cell, centered and with no border and then placed a Photoshop Smart Object within the table. The original site works fine (The current site is www.barkingcatpictures.com).

Currently: I am trying to have one of the pages have multiple photos within the area that shows the larger image in my original site, and I would like users to be able to rollover the image and have a larger image appear. I have tried creating these rollovers in image ready, but due to slices being placed overtop of the slice that would reveal the image, slice order will not allow me to do this. So I have been trying to create layers in GoLive. I have read a lot of the posts and Nate's posts have been helpful. I have looked at the link below:
Here's a tutorial that should clarify:
 <http://mindpalette.com/tutorials/center_layers/index.php>
 <http://www.adobeforums.com/webx/.59b85b05/0>
I have found the area in the source code, but I wanted to be sure adding the "wrapper" command will work since my code is diferent due to using the table.


	
		
			

Since the table is already centered, will this change the entire page?

Sorry for the long post! If you have any other suggestions on how to proceed, please dont' hesitate.
Thanks in advance for all of your help!
Beth
Re: Placing a layer on top of a table
#212
Author: Nate_Baldwin
Date: Wed, 25 Mar 2009 03:14
1 lines
875 bytes
Just put the wrapper around your table, and make it the same width as the table. The rest of the settings should be the same. If you get it set up that way and it's not working, post back with a link if you can. Be sure to check in the browser though - it's not likely to look right in GoLive.
Re: Placing a layer on top of a table
#216
Author: Beth_A_Edwards
Date: Wed, 25 Mar 2009 20:21
8 lines
951 bytes
Hi Nate,

Thank you so much! I have added the wrapper. The page centers, but the layers are still moving when the window is resized in any of the browswers or within GoLive. Below is a link - the images are not on the page, but the code is there.
 <http://barkingcatpictures.com/pages/places1test.html>

I really appreciate your insight!
Have a great day
Beth
Re: Placing a layer on top of a table
#217
Author: Murray
Date: Wed, 25 Mar 2009 20:43
24 lines
1304 bytes
That means that the layers' code is not within the wrapper.  Indeed, nothing 
is within the wrapper!

 <body onload="preloadImages();" bgcolor="black">
 <div id="wrapper"></div>

Change that code to this -

 <body onload="preloadImages();" bgcolor="black">
 <div id="wrapper">

Then change this -

</body>

to this -

</div>
</body>

and see what happens.

-- 
Murray
Re: Placing a layer on top of a table
#218
Author: Beth_A_Edwards
Date: Wed, 25 Mar 2009 21:21
8 lines
865 bytes
Hi Murray,

Thanks so much for you help! Worked great!!!!

Have a great day.
Beth

P.S. You and Nate are awe inspiring. I have read so many of your posts. Thanks for sharing your knowledge!
Re: Placing a layer on top of a table
#219
Author: Murray
Date: Thu, 26 Mar 2009 06:08
8 lines
1074 bytes
You're welcome, Beth.  There's no difference between you an me other than 
having spent a few hours learning HTML and CSS.  Every question here gets 
back to those basics.

And the answer is ALWAYS in the code....

-- 
Murray
Re: Placing a layer on top of a table
#220
Author: Beth_A_Edwards
Date: Thu, 26 Mar 2009 15:58
6 lines
1154 bytes
The links are moving with the page, and they look great - thanks again!

I have a new issue related to the links. I have created multiple links around smaller photos (these are part of a smartphotoshop which is placed within a table) that are simply placeholders so that I can use the show/hide action to reveal a layer that has a larger version of the image. Of course it works in GoLive, and it works in Firefox, but it isn't working IE or Netscape. The odd thing is that I have 2 drop down menus that work fine in all the browsers. Any suggestions?

Thanks
Beth
Re: Placing a layer on top of a table
#221
Author: Murray
Date: Thu, 26 Mar 2009 17:29
8 lines
1034 bytes
> Any suggestions?

It is with genuine trepidation that I say "SHOW US YOUR CODE"!  Without it 
we are just guessing.


-- 
Murray 
Re: Placing a layer on top of a table
#222
Author: Beth_A_Edwards
Date: Thu, 26 Mar 2009 18:02
9 lines
857 bytes
Hi Murray,

Complete trepidation!!! :)
Below is a link - there are no images, but the code is present.
 <http://www.barkingcatpictures.com/pages/portrait2atest>

Thanks
Beth
P.S. At this point I have not added the wrapper to this page
Re: Placing a layer on top of a table
#223
Author: Murray
Date: Thu, 26 Mar 2009 18:56
32 lines
2226 bytes
Beth:

The bulk of GL-specific (and non-standard) markup on that page is a bit 
daunting for me.  I'm not quite sure what you are describing.  But I 
*believe* that this is the problem -

<div id="pic01small" onmouseover="CSAction(new 
Array(/*CMP*/'53fc08c10'));return true;" onmouseout="CSAction(new 
Array(/*CMP*/'53fdea311'));" csout="53fdea311" csover="53fc08c10"></div>

You have applied these links to a <div> tag.  I would suggest that you NEVER 
do that, since different browsers will react differently to such things - 
some only triggering the events when the mouse is IMMEDIATELY over the 
border of the div, and some not triggering at all.  This sounds suspiciously 
like the symptoms you report.  Mouse events should always be applied to <a> 
tags only, and then only <a> tags that also contain an href attribute.

Is it your intention to have images within these divs (seems like it would 
be)?  In that case, you'd need to have markup like this -

<div id="pic01small"><a href="javascript:;" onmouseover="CSAction(new 
Array(/*CMP*/'53fc08c10'));return true;" onmouseout="CSAction(new 
Array(/*CMP*/'53fdea311'));" csout="53fdea311" csover="53fc08c10"><img 
src="images/foo.gif"></a></div>

Note how the event has been migrated from the <div> tag to the anchor tag 
that wraps the <img> tag, i.e., the contents of the div.

Or am I off the deep end here?

-- 
Murray 
Re: Placing a layer on top of a table
#229
Author: Beth_A_Edwards
Date: Thu, 26 Mar 2009 21:51
10 lines
1482 bytes
Hi Murray,

Thanks for getting back to me! I believe you understand what I am trying to do. I have loaded the site (link below) so that you can see what i'm trying to do. When you load the page, you will see 8 images - when you mouse over each image, I am trying to have a larger image appear.
 <http://www.barkingcatpictures.com/test/web-content/portrait2a.html>

I apologize I am not very fluent with code - thus GoLive, but if i understand correctly i should NEVER use in this way because different browsers will handle the code differently, and that I should use an anchor. Should I retype the code to match what you suggested above or should I change to anchors within GoLive?

I really appreciate your patience and help!
Beth
P.S. I have only added the wrapper to one page on the site so far (places - page 1) so submenus will shift if you navigate within the site.
Re: Placing a layer on top of a table
#235
Author: Murray
Date: Thu, 26 Mar 2009 23:05
7 lines
1134 bytes
Wait - I have looked more fully into the page's code.  Why do you want to 
have that rollover effect on the center image at all?  It doesn't seem to be 
useful, really.  And if I am missing something, and it is, why not use 
hotspots rather than that array of layers with events hanging on the <div> 
tags?
-- 
Murray
Re: Placing a layer on top of a table
#236
Author: Beth_A_Edwards
Date: Thu, 26 Mar 2009 23:47
7 lines
1310 bytes
Hi Murray,

I was adding the multiple layers with a rollover action in the center so that the user could mouse over each image and see a larger version of the picture. The larger picture does not replace the smaller image, but for lack of a better word, floats overtop the center image. I didn't use hotspots for two reasons - first because I thought you could only link another page and two because i don't have an image map. If this is the only way to do this, I can go back into ImageReady and create an image map.

The rollover effect works within FireFox, but as you explained not every browser processes s the same.
Thanks
Beth
Re: Placing a layer on top of a table
#237
Author: Murray
Date: Fri, 27 Mar 2009 00:31
16 lines
1330 bytes
Here's my take - the larger image is not so much larger that you get to see 
appreciably more than you see from the smaller ones.  And since you only do 
this for the start image when you land on that page, I think you could 
easily get rid of it.

> I didn't use hotspots for two reasons - first because I thought you could 
> only link another page

That's not correct.  You can trigger any behavior with one.

> two because i don't have an image map

Doesn't GL have a way to create one?

-- 
Murray
Re: Placing a layer on top of a table
#233
Author: Murray
Date: Fri, 27 Mar 2009 05:11
16 lines
1350 bytes
What adorable shots.

This page is working fine for me both in IE7 and FF3.  Where are you seeing 
the problems?

> I apologize I am not very fluent with code - thus GoLive, but if i 
> understand correctly i should NEVER use in this way because different 
> browsers will handle the code differently, and that I should use an 
> anchor. Should I retype the code to match what you suggested above or 
> should I change to anchors within GoLive?

Just standby and let's make sure that there is a problem to fix.


-- 
Murray
Thread Navigation

This is a paginated view of messages in the thread with full content displayed inline.

Messages are displayed in chronological order, with the original post highlighted in green.

Use pagination controls to navigate through all messages in large threads.

Back to All Threads