I’m using jquerytools overlay on a site and i cannot get the overlay (which pulls in content from a url) to center on the page. I simply cannot see why and my brain hurts. I’ve been trying different things for about a week now to no avail.
If anyone can help i would be very very grateful indeed.
The url of the site is (and the page in question) http://bruce.ourcollective.eu and the overlays are in the bottom right hand corner of the screen: Credits Contact and Copyright symbol.
Thank you!
Looks like you’re centering it with javascript, which is a bit over complicated if you ask me since CSS is also capable of doing that and is a lot more lightweight. Check this out: http://www.search-this.com/2008/05/15/easy-vertical-centering-with-css/
It all seems to center for me (in Firefox) unless I’m missing something. What browser are you using? Do you mean the popup boxes being centered?
That is a great suggestion. However, the jquerytools overlay plugin positions the overlay on the page itself. There doesn’t seem to be anything i can do to stop it! I don’t think i can change it with css 
It seems to work in Google Chrome too.
Internet Explorer is giving me some object not supported errors on your site, which are due to the addEventListener events that you have going there.
If that’s ignored, the cufon stuff fails to load and you’re up the creek without any paddling implements.
Yes it’s the popup boxes that don’t seem to be centering properly.
With regards to the addEventListener events stuff, it’s not my front end code, it’s someone else’s that i’ve been tasked to deal with. A job i’d rather not be doing. I’ve used jquerytools overlays loads of times and never had these issues, lord only knows why it’s not working now.
I haven’t tested it in IE yet. Is it fubar?
It seems to be working so far in Firefox and Google Chrome.
We need to be able to experience the failure before we can advise about how to achieve success.
Do you use a different web browser, or the same as those which currently work?
I’m happy to ignore the IE issues for now. Let’s get the main issue sorted.
Well i’m trying it in chrome, safari and firefox on osx all with the same results.
I’ve fiddled with the css which seem to be centering two of the overlays but one of them is not playing ball. The “contact” overlay is not centering absolutely vertically.
For example, i’m on a 15" laptop and the contact overlay is much nearer the bottom than the top. That is the main problem. If i do something to get the contact overlay centered, it makes the other two links uncentered.
Very frustrating!
In that case I suspect that it’s something personal like screen resolution which is causing our similar browsers to show different results.
I’m on 1440x900, and I suspect that you will be on a smaller screen resolution.
When I make the browser window smaller I do see the problem.
Ahh really. So on your much larger resolution they are all centered vertically?
Credits certainly appeared to be, but that’s only due to chance where the top of the panel just-so-happens to appear to be approximately equidistant from the bottom.
I doubt I’ll be able to be of much help with this though, as I’m going in for dental surgery within the next hour.
Knowing about the screen resolution issue though should help others who come along to assist.
Okay, well thank you very much for your time, it’s been very useful.
Also, good luck with the teeth!