Take a Quick Look at This "Church of Tim" Page!
 

I've been vaguely taking it upon myself to convert the Church into something browser friendly (currently it validates as XHTML 1.0 Trans [stupid target attrib! :(] and CSS2), but before I integrate it into the PHP, I'd like to get a little beta test action. So go to this page and see how it looks. If you see a problem, let me know your browser/OS, or even take a screenshot if you're feeling adventurous.

Known issues:

• the rolling screenshots slideshow, and screenshots popup
• the anti-censorship button doesn't work in IE
• technically, I'm not supposed to do the ol' <!-- //--> trick for javascript, so I'll move that to an external script eventually

Wow... that site of yours is so... informative?
But seriously, I think you made a linking error or something.

(twifkak) :eek::pan:

EDIT: Much better now, thank you.

Yeah, I got the same thing. You've certainly changed the way COT renders, alright ;)

Further proof that the world is conspiring against me. All fixed now. Hopefully.

Looks good now under IE 6.0.2800.1106. How are you doing the censorship toggle, anyway, to make it incompatible with IE?

Looks fine on my Mozilla Firebird (v 0.6.1).

CSS - the :target pseudo-selector, combined with the display attribute. (Well, the visible attribute, too, but that's just redundant -- in an effort to get it to work with IE.)

edit: Here's the relevant CSS:
#penis {
display: inline;
visibility: visible;
}

#penis:target {
display: none;
visibility: hidden;
}

And here's the javascript to make it propogate:
<script type="text/javascript">
<!--
if (document.URL.indexOf('#penis') != -1) {
f=0;
for (i=0; i<document.links.length; i++) {
l=document.links[i];
if (l.href)
if ((l.href.indexOf(':') == -1 || l.href.indexOf('http:') != -1) && l.href.indexOf('#') == -1) {
l.href += '#penis';
}
f++;
}
}
//-->
</script>

</body>
</html>

No [pre] tag for me... :P

BTW, if you know of a good way of displaying the fixed-width menu box on the right margin without making the whole page a big table, I'd really appreciate it. The absolute positioning thing just doesn't cut it, as currently implemented.

Tried it with Opera 7.20 and the censor button, the statue and hands were always misaligned (Causing a black banner all across the page). I tried it with all the browser identifications (Opera, MSIE 6.0, Mozilla 5.0, Mozilla 4.78 and Mozilla 3.0)

Yeah, absolute positioning is useless if your page doesn't take up 100% of the width of the window. I guess you could use javascript to collect the viewing area width and divide by two. That means if anyone resizes the window, though, it'll look bad. You can add a resize event to correct that, but then it looks even worse (trust me). I think you may be stuck with a table. Or an imagemap, I guess.

OK. This was a really weird coincidence. I was downloading Opera to fix it, and while doing so, I was looking at the code, and noticed a really long line. I don't like really long lines of tags strewn together, so I made it two lines. It turns out that was the fix. It's some sort of Opera bug that'll accept:
<a name="timstatue" id="timstatue"><img src="davim4site.jpg" alt="Our God Tim, as John Ashcroft would like him to look" title="Our God Tim, as John Ashcroft would like him to look" width="288" height="641" /></a>
<a href="http://www.uiuc.edu/~dmullins/tig.html#penis"><img id="penis" src="censored2.gif" alt="This has been censored to aid some people in their penisophobia... Jon... Feel free to click. It shouldn't bite... I dare ya..." title="This has been censored to aid some people in their penisophobia... Jon... Feel free to click. It shouldn't bite... I dare ya..." width="121" height="121" style="position: relative; left: +65px; top:-379px;" /></a>

but not:
<a name="timstatue" id="timstatue"><img src="davim4site.jpg" alt="Our God Tim, as John Ashcroft would like him to look" title="Our God Tim, as John Ashcroft would like him to look" width="288" height="641" /></a><a href="http://www.uiuc.edu/~dmullins/tig.html#penis"><img id="penis" src="censored2.gif" alt="This has been censored to aid some people in their penisophobia... Jon... Feel free to click. It shouldn't bite... I dare ya..." title="This has been censored to aid some people in their penisophobia... Jon... Feel free to click. It shouldn't bite... I dare ya..." width="121" height="121" style="position: relative; left: +65px; top:-379px;" /></a>

Thanks, Fool, for infoing me.

Doug - Quite the oppose, actually. Absolute positioning is forcing me to keep the fixed-width style I loathe. I have oodles of black-space to the right of the page, at 1280x1024. I would like the right half to extend to whatever the width of the page is, and Mozilla, at least, doesn't let you use absolute positioning without specifying the left attribute, which is no good to me.

Okay, wait, I'm mildly confused... you want blank space on the left but you want the right to extend to the extreme right?

/----------\

|xx|page   |

|xx|page   |

\----------/

Do you mean using say target="_blank" when linking? If so here is a work around provided by Sitepoint, http://www.sitepoint.com/article/1041 .

Btw... I just added [ pre ], but there's a minor problem. Because of the way vb handles newlines, each newline will show up as 2 newlines.

I typed these

two lines single-spaced

Here's the deal. I have 3 main <div>s: the one that contains the big table with the border images and the actual content (because no one supports CSS3's border-image yet), the menu, and the poll. I would like the big table to resize, so that it stretches to meet the width of the browser, instead of stopping at 752 pixels. I would like the menu to move, so that it remains in the same place relative to the right edge of the main <div>.

Moos! Thanks for the link. I had considered using onclick=window.open, but I didn't want to add it for each element, and I was never a big fan of it to begin with (mostly, though, because people did href=javascript:window.open, and that meant I couldn't Copy Link Location). This, however, is neat. I will do it. Were you aware of this problem, or did you learn about it just to help me out? ;)

blah

blah

Indeed. Well, if changing the code to output "<br />" instead of "<br />\n" is an option... otherwise, add a [br] tag and force us to right one line code? Hrmm... at this point, its inconvenience is not quite worth its utility.... Well, thanks for the double-spaced version, then. :P

Twif, earlier this summer when I was learning about website design I must have read just about every article on SitePoint (wonderful site). I was really into being standard commpliant and everything so I naturally used this method. But later I decided that is was worth the bother and I'm switched back to the old "_blank". :D I also had my entire site designed using solely CSS, but I was unable to make it display the same in both Mozilla and IE, as result I am now using a mix of tables and CSS.

As for your other problem, Sitepoint has another article that my help you. Here it is. It doesn't address your problem specifically but I think that you might be able to use the basic concept. Then again you might not.

Looks perfect in Mozilla 1.4 (win)

That test page is the Church drawing correctly in Safari on MacOS X for the first time ever

That's the first thing I tried. Mozilla doesn't seem to like it when I set left to auto, and just assumed I typed zero.

Hmm...

BTW, Devin, the top thing, 'NEWS at the' should align bellow with the top line of 'church' with no pixels between. Also, don't mess with the spacing between the items in the menu on the right. EDIT: When I say, 'don't mess' I mean, leave the images and the string without any spaces or line breaks and don't convert it into whatever you converted it in.

I will not give you my blessing from hell until you incorporate the jungle of php into that page... and it works...

I feel violated on some fundamental level...