Auto-Stretch logo [Archive]

manguish

01-01-2005, 12:46 PM

At the top of the forum pages everyone obviously has their logo.

I also want to add a banner next to it - no problem.

BUT.

If i view it in my 1152x864 screen it looks fine. If someone in 800x600 (for example) looks at it - its all off to the right side of the screen (creating a scroll bar).

How can i auto resize it to not so this? Will it involve using conditionals and differing banners to achieve the "fit on page" scenario?

SVTBlackLight01

01-01-2005, 06:44 PM

I don't know how to do it, but to point you in the right direction, it will require the use of JavaScript to detect the users resolution.

SVTBlackLight01

01-01-2005, 07:11 PM

I found this code that should do what you need.

<html>
<head>
<script>

window.onload = setBanner;

function setBanner()
{
var w = screen.availWidth;
var i = document.getElementById('banner');
if (w >= 1000) {
i.src = 'image_big.jpg'
}
else if (w >= 700) {
i.src = 'image_medium.jpg'
}
else {
i.src = 'image_small.jpg'
}
}
</script>
</head>
<body>

<img id='banner' src=''>

</body>
</html>

Guy G

01-01-2005, 07:15 PM

make sure that the table width is at percentage and not pixels.
example, width="50%" and not width="350pix"

manguish

01-02-2005, 02:29 PM

Cheers - i'll give it a go and report back ;)

funinthesun

04-20-2006, 10:04 PM

Where do you put that code?