PDA

View Full Version : Pimp My Site Questions for Andy


javier.rinaldi
Feb-25-2006, 11:16 AM
Hi guys,

my bio-box clickable slide-show (http://rinaldi.smugmug.com) is on the fritz on IE. I dunno if it's the css since I just noticed it today. I'm not the only one either, I saw the same behaviour in http://photoscapedesign.smugmug.com . Is this the so called IE "flash", it certainly wasn't happening a few days ago, I've tried it on several PC's.

Any Ideas?

Barb
Feb-25-2006, 11:26 AM
Hi guys,

my bio-box clickable slide-show (http://rinaldi.smugmug.com) is on the fritz on IE. I dunno if it's the css since I just noticed it today. I'm not the only one either, I saw the same behaviour in http://photoscapedesign.smugmug.com . Is this the so called IE "flash", it certainly wasn't happening a few days ago, I've tried it on several PC's.

Any Ideas?
Yep, definitely exhibiting some strange behavior in IE on a PC. (I have a PC that I turn on for occasions such as this :) ) This is new. As Jav said, was fine a day or so ago.

rainforest1155
Feb-25-2006, 11:38 AM
Yep, definitely exhibiting some strange behavior in IE on a PC. (I have a PC that I turn on for occasions such as this :) ) This is new. As Jav said, was fine a day or so ago.
Eeekk...I see it too. That's some serious flicker you've got there and I've never seen this before even though I use IE all the time. Don't know what's wrong there. :dunno

Sebastian

javier.rinaldi
Feb-25-2006, 11:47 AM
Eeekk...I see it too. That's some serious flicker you've got there and I've never seen this before even though I use IE all the time. Don't know what's wrong there. :dunno

Sebastian

Interestingly enough, Andy's Guestbook (http://www.moonriverphotography.com/gallery/729385) has similar code and works well.

:scratch

Mike Lane
Feb-25-2006, 11:54 AM
These were posted in a thread that they didn't have anything to do with so I moved them into their own thread.

Andy got this code from stu williams over at http://cssplay.co.uk/. I haven't messed with the code at all so I'll let Andy deal with it.


Andy? :andy :ear :deal

Andy
Feb-25-2006, 12:08 PM
so I'll let Andy deal with it.


Andy? :andy :ear :deal

Yer joking, right? :D
Guys, this stuff was all trial and error for me, too. I couldn't begin to tell you why there's flickering going on... I wish I had a better answer for you, I really do. I'm sorry. Maybe next week when I'm back I can look into it further...

Mike Lane
Feb-25-2006, 12:18 PM
Yer joking, right? :D
Guys, this stuff was all trial and error for me, too. I couldn't begin to tell you why there's flickering going on... I wish I had a better answer for you, I really do. I'm sorry. Maybe next week when I'm back I can look into it further...

Mostly :lol3

You can at least provide a linky :ear

Andy
Feb-25-2006, 12:20 PM
Yer joking, right? :D
Guys, this stuff was all trial and error for me, too. I couldn't begin to tell you why there's flickering going on... I wish I had a better answer for you, I really do. I'm sorry. Maybe next week when I'm back I can look into it further...

Yuck. I'll look into it later tonight when I get some more time.

Andy
Feb-25-2006, 12:24 PM
Mostly :lol3

You can at least provide a linky :ear

Thanks Mike - really appreciate it.

OK what's strange, here in this gallery, no flickerage:
http://williams.smugmug.com/gallery/729385

In this gallery, there's severe flickerage. The main difference between the two is the little thumbs are clickable to external links.
http://williams.smugmug.com/gallery/729350

And for real fun, look at this one:
http://williams.smugmug.com/gallery/729385

Mike Lane
Feb-25-2006, 12:29 PM
Thanks Mike - really appreciate it.

Oh relax. Have you a link to where you got the code in the first place?

Andy
Feb-25-2006, 12:36 PM
Oh relax. Have you a link to where you got the code in the first place?

d00d I was serious when I said "really appreciate it" :D
uhm

the code
uhm yep... found it...

http://www.cssplay.co.uk/menu/scroll_gallery.html

Thanks Mike!

Barb
Feb-25-2006, 12:56 PM
Yer joking, right? :D
Guys, this stuff was all trial and error for me, too. I couldn't begin to tell you why there's flickering going on... I wish I had a better answer for you, I really do. I'm sorry. Maybe next week when I'm back I can look into it further...

I have no explanation either, but it was working day before yesterday, if not just yesterday. I usually check my site in IE at work to make sure everything is running okay, and it was either yesterday or the day before when I checked it and it was fine. I have changed nothing in the code for that, so it's a head scratcher for me.

Mike Lane
Feb-25-2006, 01:15 PM
d00d I was serious when I said "really appreciate it" :D


Well why didn't you just say so :D

Mike Lane
Feb-25-2006, 01:18 PM
I think maybe this is the one that is causing problems? Or at least this one is also causing problems.

http://www.cssplay.co.uk/menu/gallery.html

Lemme see if I can figure it out.

Andy
Feb-25-2006, 01:18 PM
Well why didn't you just say so :D

So, you fix my problem yet? :lol3

javier.rinaldi
Feb-25-2006, 01:21 PM
Well,
after looking around, changing stuff, putting it back (I have some leftover screws, I hope I don't need 'em) I narrowed it down to something Andy mentioned, links. I went to the CSSplay site http://www.cssplay.co.uk/menu/gallery.html and discovered that it worked fine and that it had no links to the images.
I played with my css, nothing, I removed the contents of <href=""> and it works fine, weird.
Something changed in the past days that affected this, but for the time being I'd rather have it functional than have the links

Mike Lane
Feb-25-2006, 01:56 PM
There are HTML errors on all the pages posted above that have problems. I'm not sure they are related to the problems but I'm investigating. Andy one of your links on this page (http://williams.smugmug.com/gallery/729350) has an extra " and Barb and Javier your pages are riddled with improperly nested elements and unclosed tags. While I'm researching you guys should fix those up.

Mike Lane
Feb-25-2006, 02:04 PM
We know that smugmug recently fixed IE's image flicker problem (http://blogs.smugmug.com/release-notes/2006/02/23/new-features-fixes-february-23-2006/). Presumably that would change the way that IE handles linked images in general or maybe linked smugmug images. I don't know the specifics of what they did or if it would affect this particular bit of customization or not.. It seems pretty clear that if there is a URL associated with the links that you get an extreme version of flicker in IE for this particular application. I wonder if JT could weigh in on this?

bigwebguy
Feb-25-2006, 02:17 PM
We know that smugmug recently fixed IE's image flicker problem (http://blogs.smugmug.com/release-notes/2006/02/23/new-features-fixes-february-23-2006/). Presumably that would change the way that IE handles linked images in general or maybe linked smugmug images. I don't know the specifics of what they did or if it would affect this particular bit of customization or not.. It seems pretty clear that if there is a URL associated with the links that you get an extreme version of flicker in IE for this particular application. I wonder if JT could weigh in on this?
i dont even need to see this to know what the problem (and solution is), the same thing was happening to my slideshow buttons after the latest batch of changes.

you have an image inside an href that's floated right?

you need to specify height & width for the image in css.

so like a img {height: 20px; width: 20px;} or something similar to that.

the offending code that was added in the smugmugBlack.css file is a:hover {width: auto;} in case anyone is interested....i ran this up to JT the other day actually and he said that's what he had to do to fix the IE flicker.

javier.rinaldi
Feb-25-2006, 05:49 PM
i dont even need to see this to know what the problem (and solution is), the same thing was happening to my slideshow buttons after the latest batch of changes.

you have an image inside an href that's floated right?

you need to specify height & width for the image in css.

so like a img {height: 20px; width: 20px;} or something similar to that.

the offending code that was added in the smugmugBlack.css file is a:hover {width: auto;} in case anyone is interested....i ran this up to JT the other day actually and he said that's what he had to do to fix the IE flicker.

Thanx bigwebguy, this helped out a lot. I inserted the above code into the css play code for the gallery
And thanx Mike for pointing out my element and tag troubles, I did my best to clean it up.

a.gallery:hover {width:75px; height:47px; white-space:normal; border:1px solid #fff;}
a.gallery:hover img {border:1px solid #000; position:relative; z-index:100;}
a.gallery:hover span {display:block; position:absolute; width:400px; height:266px; top:120px; left:5px; padding:5px; font-style:italic; color:#696969; background:#696969 url(); z-index:100;}
a.gallery:active img {width:75px; height:47px; border:1px solid #000; position:relative; z-index:50;}
a.gallery:focus img {width:75px; height:47px; border:1px solid #000; position:relative; z-index:50;}
a.gallery:active {border:0px solid #eee;}
a.gallery:active span {display:block; position:absolute; width:400px; height:266px; top:120px; left:5px; padding:5px; font-style:italic; color:#696969; background:#efedec url(); z-index:50;}
a.gallery:focus span {display:block; position:absolute; width:400px; height:266px; top:120px; left:5px; padding:5px; font-style:italic; color:#696969; background:#efedec url(); z-index:50;}

Andy
Feb-25-2006, 07:25 PM
so, this fixed my b0rkage

a.gallery:hover {width:75px; height:47px;}

(thanks Lee).

Barb
Feb-25-2006, 08:16 PM
i dont even need to see this to know what the problem (and solution is), the same thing was happening to my slideshow buttons after the latest batch of changes.

you have an image inside an href that's floated right?

you need to specify height & width for the image in css.

so like a img {height: 20px; width: 20px;} or something similar to that.

the offending code that was added in the smugmugBlack.css file is a:hover {width: auto;} in case anyone is interested....i ran this up to JT the other day actually and he said that's what he had to do to fix the IE flicker.

Fixed things up and it seems to work now. Thx everyone for their help :)

brandofamily
Mar-04-2006, 07:49 PM
so, this fixed my b0rkage

a.gallery:hover {width:75px; height:47px;}

(thanks Lee).
Andy, is there a thread w/ the non-flicker version of this hover slide show w/ the links from each image and captions added?....I've seen your site, but I'm looking to do a bit of reading before I try it. I'd like to use it on my gallery link page....since the catagory links are pretty static for that portion of my site.

Andy
Mar-04-2006, 07:51 PM
Andy, is there a thread w/ the non-flicker version of this hover slide show w/ the links from each image and captions added?....I've seen your site, but I'm looking to do a bit of reading before I try it. I'd like to use it on my gallery link page....since the catagory links are pretty static for that portion of my site.

:scratch Anthony - "non-flicker slide show" I don't understand...

brandofamily
Mar-04-2006, 10:27 PM
:scratch Anthony - "non-flicker slide show" I don't understand...
Well, I was reading about the hover over type slide show you have on your link page. In my reading I came to a thread that said the show was flickering. By the looks of things it no longer flickers....
As for the rest....I did some looking and figured out most of the code needed. I'm testing in this gallery...

http://brandolinoimaging.smugmug.com/gallery/1089783

a few problems...
1. I have the links working, but the images do not show up on the grey box.
2. I can not figure out the code enough to line up the thumbs under the big image...
Could you check out the code and see if you can spot the issues...
Thanks....
Oh, I assume I can change the dimensions for the thumbs' dispaly "box" to fit MY thumbs' sizes...right?

devbobo
Mar-04-2006, 10:53 PM
Issue 1

Your code...

<div id="thumbs"><br />
<a class="gallery slide1" href="http://www.brandolinoimaging.com/My Portfolio"><span><br>My Portfolio<br></span></a><br />
<a class="gallery slide2" href="http://www.brandolinoimaging.com/European Tour 2003"><span><br>European Tour 2003<br></span></a><br />
<a class="gallery slide3" href="http://www.brandolinoimaging.com/Angels of Hope"><span><br>Angels of Hope<br></span></a><br />
<a class="gallery slide4" href="http://www.brandolinoimaging.com/Football Pics"><span><br>High School Football 2005<br></span></a><br />
<a class="gallery slide5" href="http://www.brandolinoimaging.com/Event Photography/160438"><span><br>Event Photography<br></span></a><br />
<a class="gallery slide6" href="http://www.brandolinoimaging.com/Portrait Shots"><span><br>Portrait Photos <h3>(Password Protected)</h3><br></span></a><br />
<br />
</div>


Andy's code...

<div id="thumbs">
<a class="gallery slide1" href="http://www.smugmug.com/?referrer=lKTcC0p8CkfRK" target=" _blank"><span><img src="http://williams.smugmug.com/photos/55289093-S.jpg" alt="Andy"/><br />SmugMug - The Best Photo Sharing on The Planet<br /></span></a>
<a class="gallery slide2"href="http://www.dgrin.com" target=" _blank"><span><img src="http://williams.smugmug.com/photos/55289026-S.jpg" alt="Andy"/><br />Dgrin Photography Forum<br /></span></a>
<a class="gallery slide3" href="http://www.moonriverphotography.com/gallery/106204"><span><img src="http://williams.smugmug.com/photos/55289056-S.jpg" alt="Andy"/><br />Kodak Photo Of The Day Winners<br /></span></a>
<a class="gallery slide4" href="http://www.moonriverphotography.com/gallery/730399"><span><img src="http://williams.smugmug.com/photos/55289034-S.jpg" alt="Andy"/><br />My Photo Gear<br /></span></a>
<a class="gallery slide5" href="http://www.dgrin.com/showthread.php?t=25634" target="_blank"><span><img src="http://williams.smugmug.com/photos/55289082-S.jpg" alt="Andy"/><br />2006 Shootout at Bryce and Zion<br /></span></a>
<a class="gallery slide6" href="http://blogs.smugmug.com/pros" target=" _blank"><span><img src="http://williams.smugmug.com/photos/55289014-S.jpg" alt="Andy"/><br />Andy's Pro Blog<br /></span></a>
<a class="gallery slide7" href="http://app.feeddigest.com/digest3/DD5FP5Y1OW.html" target ="_blank"><span><img src="http://williams.smugmug.com/photos/55289073-S.jpg" alt="Andy"/><br />Feed Digest of My Favorite Photographers<br /></span></a>
<a class="gallery slide8" href="http://homepage.mac.com/david_rosenthal/AndyRandomQuoteGenerator.htm" target="_blank"><span><img src="http://williams.smugmug.com/photos/55289002-S.jpg" alt="Andy"/><br />Evidently, I have a lot to say...The ARQG<br /></span></a>
<a class="gallery slide9" href="http://earth.google.com" target="_blank"><span><img src="http://williams.smugmug.com/photos/55289049-S.jpg" alt="Andy"/><br />Google Earth is Awesome<br /></span></a>
</div>


Something missing ? :scratch

devbobo
Mar-04-2006, 10:55 PM
Issue 2

Remove the elements in red...


<div id="thumbs"><br />
<a class="gallery slide1" href="http://www.brandolinoimaging.com/My Portfolio"><span><br>My Portfolio<br></span></a><br />
<a class="gallery slide2" href="http://www.brandolinoimaging.com/European Tour 2003"><span><br>European Tour 2003<br></span></a><br />
<a class="gallery slide3" href="http://www.brandolinoimaging.com/Angels of Hope"><span><br>Angels of Hope<br></span></a><br />
<a class="gallery slide4" href="http://www.brandolinoimaging.com/Football Pics"><span><br>High School Football 2005<br></span></a><br />
<a class="gallery slide5" href="http://www.brandolinoimaging.com/Event Photography/160438"><span><br>Event Photography<br></span></a><br />
<a class="gallery slide6" href="http://www.brandolinoimaging.com/Portrait Shots"><span><br>Portrait Photos <h3>(Password Protected)</h3><br></span></a><br />
<br />
</div>

brandofamily
Mar-05-2006, 05:31 AM
OK...in my tired late night state I was typing/ editting the code in a word processing program and copying to the site....never put the html tags around the code....I guess the site converts to html if you don't wrap it....thanks for the guidance....
Can the thumbs dimensions be different for each thumb or do they need to be the same?

Mike Lane
Mar-05-2006, 09:54 AM
Hey Brando, do you have notepad? I highly recommend that if you're going to use an external text editor to do this stuff, you use one that doesn't format the text (like notepad). If you're using a Mac, there is a similar program for it but I don't know what it's called.

It just seems that many of your issues are caused by your wordprocessing application.

brandofamily
Mar-05-2006, 11:40 AM
Hey Brando, do you have notepad? I highly recommend that if you're going to use an external text editor to do this stuff, you use one that doesn't format the text (like notepad). If you're using a Mac, there is a similar program for it but I don't know what it's called.

It just seems that many of your issues are caused by your wordprocessing application.
Actually, most of my formatting issues are caused by me being an idiot. This last one was me forgetting the html wrapper. The code was correct, but w/o that the site interpretted it incorrectly...The other formatting errors, previously, were me trying to neaten it up to read it easier and I b0:Drked the code slightly...:dunno

brandofamily
Mar-05-2006, 11:54 AM
I can not seem to get the thumbs centered....I'm not seeing it in the code as to how I get ti centered...can you atleat point me in the right direction...here's the page...

http://brandolinoimaging.smugmug.com/gallery/1089783

brandofamily
Mar-05-2006, 02:08 PM
so, this fixed my b0rkage

a.gallery:hover {width:75px; height:47px;}

(thanks Lee).
Got it dude:thumb

http://brandolinoimaging.smugmug.com/gallery/1089783

I don't really like the looks of the thumbs, but I'm not sure what else to do to make the better...

Mike Lane
Mar-05-2006, 03:08 PM
Got it dude:thumb

http://brandolinoimaging.smugmug.com/gallery/1089783

I don't really like the looks of the thumbs, but I'm not sure what else to do to make the better...

Your hover image isn't in the right place. I show it off to the left in IE and Firefox.

brandofamily
Mar-05-2006, 03:38 PM
Your hover image isn't in the right place. I show it off to the left in IE and Firefox.
Are you yankin' me...I just clear my cache and saved internet content and check both FF and IE. Although the hover is about 2 pixels low in IE it shows as centered to me....

Andy
Mar-05-2006, 04:18 PM
Are you yankin' me...I just clear my cache and saved internet content and check both FF and IE. Although the hover is about 2 pixels low in IE it shows as centered to me....

We yank you not:

Mike Lane
Mar-05-2006, 04:24 PM
We yank you not:

:agree

If I did a screenshot it'd look exactly like the one Andy posted.

brandofamily
Mar-05-2006, 05:21 PM
:agree

If I did a screenshot it'd look exactly like the one Andy posted.

How do WE explain that. It looks perfectly aligned on my screen...
http://brandolinoimaging.smugmug.com/photos/58724481-S.jpg

Mike Lane
Mar-05-2006, 05:32 PM
How you WE explain that. It looks perfectly aligned on my screen...
http://brandolinoimaging.smugmug.com/photos/58724481-S.jpg
Try resizing your browser window :wink

brandofamily
Mar-05-2006, 05:34 PM
Try resizing your browser window :wink
OK..I did that and see the point...what do I do about that?

brandofamily
Mar-05-2006, 05:36 PM
Try resizing your browser window :wink
Andy's page looks fine in both sizes...:cry:scratch

brandofamily
Mar-05-2006, 05:42 PM
Try resizing your browser window :wink

On my "large font screen" the hover is to the right of the image. On yours its to the left?
On my "small font screen" its lined up?:cry:dunno:1drink

Mike Lane
Mar-05-2006, 05:46 PM
The source of your problems is in this line in your CSS:

a.gallery:hover span, a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:271px; top:225px; left:288px; border:4px ridge #D5B790; padding:10px; font-style:normal; font-size: 14px; color:#e3cfb5; background:#3e3325;}


Position:absolute; is a very tricky monster. What you did in a nutshell is told the browser to put the hover image 225px down from the top of the next eldest positioned element and 288px from the left of that same element. That clearly looks good on your screen, but for someone with a higher or lower screen resolution they will see different results. When I resize my browser using the webdev extension to 1024x768, your hover image is positioned perfectly, so you clearly have a 1024x768 monitor. When I resize my browser to 800x600 the hover image is off to the right. See what I'm getting at?

This fixes you up.

a.gallery:hover span, a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:271px; top:225px; left:50%; margin-left:-204px; border:4px ridge #D5B790; padding:10px; font-style:normal; font-size: 14px; color:#e3cfb5; background:#3e3325;}

What I did was told the browser to put the left edge right smack dab in the middle and then I told it to move left exactly half the total width (which is the declared width plus the sum of the widths of the borders). My changes are in red.

brandofamily
Mar-05-2006, 05:55 PM
The source of your problems is in this line in your CSS:

a.gallery:hover span, a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:271px; top:225px; left:288px; border:4px ridge #D5B790; padding:10px; font-style:normal; font-size: 14px; color:#e3cfb5; background:#3e3325;}


Position:absolute; is a very tricky monster. What you did in a nutshell is told the browser to put the hover image 225px down from the top of the next eldest positioned element and 288px from the left of that same element. That clearly looks good on your screen, but for someone with a higher or lower screen resolution they will see different results. When I resize my browser using the webdev extension to 1024x768, your hover image is positioned perfectly, so you clearly have a 1024x768 monitor. When I resize my browser to 800x600 the hover image is off to the right. See what I'm getting at?

This fixes you up.

a.gallery:hover span, a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:271px; top:225px; left:50%; margin-left:-204px; border:4px ridge #D5B790; padding:10px; font-style:normal; font-size: 14px; color:#e3cfb5; background:#3e3325;}

What I did was told the browser to put the left edge right smack dab in the middle and then I told it to move left exactly half the total width (which is the declared width plus the sum of the widths of the borders). My changes are in red.

Thank you...question though...why does Andy's page work fine? I copied his code as a basis for mine and he too has the absolute code...

brandofamily
Mar-05-2006, 06:00 PM
The source of your problems is in this line in your CSS:

a.gallery:hover span, a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:271px; top:225px; left:288px; border:4px ridge #D5B790; padding:10px; font-style:normal; font-size: 14px; color:#e3cfb5; background:#3e3325;}


Position:absolute; is a very tricky monster. What you did in a nutshell is told the browser to put the hover image 225px down from the top of the next eldest positioned element and 288px from the left of that same element. That clearly looks good on your screen, but for someone with a higher or lower screen resolution they will see different results. When I resize my browser using the webdev extension to 1024x768, your hover image is positioned perfectly, so you clearly have a 1024x768 monitor. When I resize my browser to 800x600 the hover image is off to the right. See what I'm getting at?

This fixes you up.

a.gallery:hover span, a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:271px; top:225px; left:50%; margin-left:-204px; border:4px ridge #D5B790; padding:10px; font-style:normal; font-size: 14px; color:#e3cfb5; background:#3e3325;}

What I did was told the browser to put the left edge right smack dab in the middle and then I told it to move left exactly half the total width (which is the declared width plus the sum of the widths of the borders). My changes are in red.

I also noticed that on a 800x600 screen, nothing on the page lines up as centered, well atleast not most of it. Why is that.

Mike Lane
Mar-05-2006, 06:01 PM
Thank you...question though...why does Andy's page work fine? I copied his code as a basis for mine and he too has the absolute code...

Don't know. I haven't looked at Andy's code. He may have it set up so the containing layer is specifically sized whereas yours was the browser width. But honestly, I don't know.

Mike Lane
Mar-05-2006, 06:02 PM
I also noticed that on a 800x600 screen, nothing on the page lines up as centered, well atleast not most of it. Why is that.

Screenshot?

brandofamily
Mar-05-2006, 06:11 PM
Screenshot?
I'll get the screen shot up in a second...I did notice there's another absolute used in the code. (I copied Andy's code as said, and really only changed colors, images and link locations. I did resize and try to align, but I added not real code.)
Heres the code..


a.gallery span {display:block; position:absolute; left:150px; top:-1px; width:1px; height:1px; overflow:hidden; background:#000;}
a.gallery:hover {white-space:normal; border:1px solid #6090D1;}
a.gallery:hover img, a.gallery:active img, a.gallery:focus img {border:1px solid #000;}
a.gallery:hover span, a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:271px; top:225px; left:50%; margin-left:-218px; border:4px ridge #D5B790; padding:10px; font-style:normal; font-size: 14px; color:#e3cfb5; background:#3e3325;}
#thumbs {width:530px; height:60px;}
#padLINKS {background:url(http://www.brandolinoimaging.com/photos/50091423-S.jpg);height:266px; width:400px;border:4px ridge #D5B790;}

1st line...

brandofamily
Mar-05-2006, 06:20 PM
Don't know. I haven't looked at Andy's code. He may have it set up so the containing layer is specifically sized whereas yours was the browser width. But honestly, I don't know.
I moved the hover down so you could see the main image is not centered.
So unless your math is wrong that is off centered...

http://brandolinoimaging.smugmug.com/photos/58735500-M.jpg

brandofamily
Mar-05-2006, 06:34 PM
Screenshot?
Using your method, how do I center the thumbs and the original image? I'll go that way with it all if you can tell me how. Seems better that the "center" div code.

brandofamily
Mar-05-2006, 07:10 PM
Screenshot?

I removed the gallery from the link until it works correctly...
Here's the URL:

http://www.brandolinoimaging.com/gallery/1089783

Hope you or one of the others can help.

brandofamily
Mar-05-2006, 07:25 PM
Devo, do you have any thoughts on the troubles I'm having w/ this hover show stuff....sorry to bother you (you'll have to read back a few posts to find the issue) but I'm getting real bumbed out. I thought I had it working until Mike and Andy came calling.
Here's the URL

http://www.brandolinoimaging.com/gallery/1089783

Mike Lane
Mar-05-2006, 07:45 PM
I moved the hover down so you could see the main image is not centered.
So unless your math is wrong that is off centered...

http://brandolinoimaging.smugmug.com/photos/58735500-Th.jpg

My math was wrong is all.

brandofamily
Mar-06-2006, 05:37 AM
My math was wrong is all.
Thanks MIke....can you do one more thing for me....check out the hover links for me in IE6.....At times the hover image sticks. By that I mean, if I actually use the link and then hit back on the browser (to return to the page) the hover image is still on top of the background image and it stays there even if I hover another image. I've even returned and had the hover be on a different part of the screen. It's usually the Angels of Hope screen that "sticks" but others are doing it too. This does not happen in FF, only IE6.

Mike Lane
Mar-06-2006, 07:15 AM
That has to deal with the problems that IE has with the :focus pseudo-class I believe. If you click on the thumb and then click back to the page and then click somewhere on the background (i.e. not on the image or thumbs) then you can see that it returns to the normal state. It is analogus to the dotted border that you generally see when you click a link in a browser. You won't be able to do anything about it using only CSS. You may be able to find an htc file that will help you out with that or you may be able to convince someone on here to create one for you. But that is a pretty advanced maneuver and I'm not completely sure it'll work out.

brandofamily
Mar-06-2006, 07:24 AM
That has to deal with the problems that IE has with the :focus pseudo-class I believe. If you click on the thumb and then click back to the page and then click somewhere on the background (i.e. not on the image or thumbs) then you can see that it returns to the normal state. It is analogus to the dotted border that you generally see when you click a link in a browser. You won't be able to do anything about it using only CSS. You may be able to find an htc file that will help you out with that or you may be able to convince someone on here to create one for you. But that is a pretty advanced maneuver and I'm not completely sure it'll work out.

I now see why you all HATE IE. Thanks for the info though. atleast I know the code now works and the gallery is lined up to center.:thumb

rich56k
Mar-06-2006, 07:42 AM
I now see why you all HATE IE. Thanks for the info though. atleast I know the code now works and the gallery is lined up to center.:thumb
For what its worth it looks/works great in safari ....yesterday was off center as you all noted
http://www.brandolinoimaging.com/gallery/1089783

off to work ....
rich

SS update tonite...