Previous Message
Next Message

Re[2]: [css-d] Changing background image

Sent by Norman Lamont on 23 January 2003 19:07


Hello Bill,

Thursday, January 23, 2003, 6:03:02 PM, you wrote:

BC> Norman Said:
BC> I've found the property 'screen.width' that can detect the width, but
BC> can't find a way to access the style previously set and change the
BC> background-image to "none".

BC> See if this gets you on your way.

BC> <style>
BC> .back {background-image: url(http://www.vaneerden.com/images/velogo.gif) ;}
BC> .back1 {background-image:none;}
BC> </style>
BC> </head>
BC> <body>
BC> Hello
BC> Dom version:
BC> <a href=# onclick="body.className='back'">Click</a>
BC> IE version:
BC> <a href=# onclick="document.all.body.style='background-image:
url(http://www.vaneerden.com/images/velogo.gif);'">Click</a>

Thanks Bill. I'm in the process of trying both this solution and the
one suggested by Brady.

This one kind of works but puzzles me.

I'm testing it in IE5.5 and IE4.

When I use the script exactly as you have it, the DOM version works.
As long as you trigger it from a link, as you have done.

The IE version doesn't! It gives the following script error:
document.all.body is null or not an object.

But when I put the DOM version into an onLoad script it fails.
If I just refer to body.background, it says 'body is undefined'; if I
change it to document.all.body as in your example, I get the same
'null or not an object'.

I've tried it in a function called from body onLoad, and I've tried
it, as below, actually in the page.
<head>
        <title>Untitled</title>
<style type="text/css">
.back1 {
background-image:url(graphics/business.jpg);
background-repeat:no-repeat;
}
.back2 {background-image:none;}
</style>

</head>

<body >
<script>
        if (screen.width>800) {
                body.className="back1"}
        else {
                body.className="back2"
                }


</script>
<a href="#" onClick="document.all.body.style='background-image:url(graphics/business.jpg)'">test</a>
<a href="#" onClick="body.className='back1'">test</a>
</body>


Howcome I can do it in a link but not otherwise ?  (Tested in IE5.5 by
the way)


I'm going to have a go at the other solution from Brady now.  Thank
you both for your time and effort.
-- 
Best regards,
 Norman                            [EMAIL-REMOVED]
http://www.normanlamont.com
Previous Message
Next Message