overflow:auto workaround - Strange Situation

need to figure out a workaround for css:auto

[ruhbehka]

Well i've lurked for long enough, I finally have a problem which hasn't been answered by the archives. Time to register and post the question.

So after much head banging and frustration, I determined that overflow: auto and sometimes overflow: scroll are not supported by Safari, IE Mac, etc. (And obviously older browsers don't support it either).

(D'oh.)

Unfortunately, the site which I am working on, is a commercial site, and needs to be seen by even those evil substandard browsers.

(The site is a corporate newsletter, where the managers can post articles that they write, via a complicated back-end system, and the article titles will appear on the main page with links to the full story. The links from the main page to the full stories are automatically generated by the php scripting which powers the whole back end.)

I can easily make the "full story" links into popups, thus eliminating the need for my div to scroll... however I'd prefer that it only do this for browsers that don't support those overflow attributes.

I can't, however, put a CSS hack directly into the page with the articles and "full story" links, because the links (either to a popup or load into the same scrolling div) have to be generated by the php script (back end).

I am not so great with Javascript but am thinking it could solve this problem? Or is there a simpler CSS way to do it?

I googled like mad and the best thing I found was a Javascript which worked by detecting DOM1 or something along those lines--this is way over my head. I could barely follow the short script, let alone figure out if it could be modified to serve my purposes. Not sure if it could be translated into PHP, to fit better with my current script... I have never used PHP for any sort of browser detection or anything along those lines.

Anyone know where I can at least start to solve this problem? Any solutions (CSS, Javascript or PHP) would be helpful.

I think I'm slowly going crazy... :)
Reb.

[BlobFisk]

Welcome to WebmasterWorld, ruhbehka!

Your logic is spot on, there is a JavaScript way to do this. It's big and not very pretty - but Dynamic Drive has a script for this I think!

HTH

[crowthercm]

Would your situation allow you to deliver content based upon environment variables? Namely include the scrolling div for Windows IE & Post netscape 4 while providing pop ups or some other solution for IE Mac, <= Netscape 4 and other non-conforming browsers?

I'm considering the same situation right now. For me traffic wise it's probably not that big a deal save IE Macintosh.

[ruhbehka]

>>Would your situation allow you to deliver content based upon environment variables? Namely include the scrolling div for Windows IE & Post netscape 4 while providing pop ups or some other solution for IE Mac, <= Netscape 4 and other non-conforming browsers? <<

In theory, yes. However I've had a heck of a time actually implementing that. The problem in part is that the code that the links are generated dynamically, as they are called to display on the main page. The code which generates the links is PHP... and the code which I'd need to use to determine the browser they are using seems to require Javascript. This is getting a bit over my head... I'm a decent code modifier but I'm looking at someone else's (uncommented) code for the PHP side of things. I played a bit with it since posting this, but can't seem to get it to work.

On a side note, I switched the overflow: to "scroll" instead of "auto" and it seems to be working nicely with IE Mac, Safari, Mozilla, Netscape 6+ and IE 4+. So that took care of part of the problems....

[crowthercm]

PHP has some built in features that I'm pretty sure should let you detect the browser type. I'm not 100% sure on that fact, but look into php's global variables and especially the environment variables. You'll probably find that the browser version there which will let you skip the whole javascript test.