Hello All,
I am trying to randomly change the background image of my home page
but I can't seem to figure it out.
Here is a snippet of my css
....
BODY {background:transparent url(../images/homepagebg3.jpg) no-repeat;
font:normal 90% Arial, Helvetica, sans-serif; color:#263158;}
....
Here is my javascript that I am trying to use to change my background
image....
<link type="text/css" href="css/main.css" media="screen"
rel="stylesheet" />
<link type="text/css" href="css/imagetitles.css" media="screen"
rel="stylesheet" />
<script language="javascript" type="text/javascript">
images = new Array(3);
images[0] = 'background:transparent url(../images/homepagebg3.jpg)
no-repeat; font:normal 90% Arial, Helvetica, sans-serif;
color:#263158;';
images[1] = 'background:transparent url(../images/homepagebg1.jpg)
no-repeat; font:normal 90% Arial, Helvetica, sans-serif;
color:#263158;';
images[2] = 'background:transparent url(../images/homepagebg2.jpg)
no-repeat; font:normal 90% Arial, Helvetica, sans-serif;
color:#263158;';
index = Math.floor(Math.random() * images.length);
document.getElementsByTagName("BODY")[0].style.background =
images[index];
</script>
Here is the error from the firefox javascript console:
Error: document.getElementsByTagName("BODY")[0] has no properties.
Any ideas? How can I randomly change my background image?
Thanks!
--
Nathan 4 44286
Nathan Given wrote: Hello All,
I am trying to randomly change the background image of my home page but I can't seem to figure it out.
Here is a snippet of my css
... BODY {background:transparent url(../images/homepagebg3.jpg) no-repeat; font:normal 90% Arial, Helvetica, sans-serif; color:#263158;} ...
Here is my javascript that I am trying to use to change my background image....
<link type="text/css" href="css/main.css" media="screen" rel="stylesheet" /> <link type="text/css" href="css/imagetitles.css" media="screen" rel="stylesheet" /> <script language="javascript" type="text/javascript">
images = new Array(3); images[0] = 'background:transparent url(../images/homepagebg3.jpg) no-repeat; font:normal 90% Arial, Helvetica, sans-serif; color:#263158;'; images[1] = 'background:transparent url(../images/homepagebg1.jpg) no-repeat; font:normal 90% Arial, Helvetica, sans-serif; color:#263158;'; images[2] = 'background:transparent url(../images/homepagebg2.jpg) no-repeat; font:normal 90% Arial, Helvetica, sans-serif; color:#263158;';
index = Math.floor(Math.random() * images.length);
document.getElementsByTagName("BODY")[0].style.background = images[index];
</script>
Here is the error from the firefox javascript console: Error: document.getElementsByTagName("BODY")[0] has no properties.
Any ideas? How can I randomly change my background image?
Thanks! -- Nathan
You can't assign this in the CSS way since it is javascript and not CSS.
In this document there appears to be no javascript property for this
(don't know if they are right): http://www.comptechdoc.org/independe...javastyle.html
A way to achieve this is to make two classes in CSS and assign a new
class to the object.
You can see how you can assign a class using javascript in my tabular
navigation example at: http://www.top100nederland.net/test/tabjes.htm
regards,
Roderik
-- http://www.archytas.nl/
webdesign, internet applicaties, internetgestuurde elektronica
Nathan Given wrote: Here is my javascript that I am trying to use to change my background image....
images = new Array(3);
[snip] </script>
Here is the error from the firefox javascript console: Error: document.getElementsByTagName("BODY")[0] has no properties.
If you have a JavaScript question, ask in a JavaScript group. I
recommend comp.lang.javascript.
--
Brian (remove ".invalid" to email me) http://www.tsmchughs.com/
Brian wrote: Nathan Given wrote:
<snip> Here is the error from the firefox javascript console: Error: document.getElementsByTagName("BODY")[0] has no properties.
If you have a JavaScript question, ask in a JavaScript group. I recommend comp.lang.javascript.
Fair enough, but the explanation of the error is fairly simple. A script
executed inline within the HEAD section of a page executes prior to the
HTML parser encountering (or implying) the opening BODY tag. As a result
there is no BODY element within the DOM to refer to and -
document.getElementsByTagName("BODY") - must return an empty nodeList at
that point (so there is no item at index zero within that nodeList).
Richard.
Thank you all.
It turns out two problems:
First, Richard was right.
Second, I had the wrong path to my images. Wow, I'm dumb.
THanks for all your help!
--
Nathan
"Richard Cornford" <Ri*****@litotes.demon.co.uk> wrote in message news:<cd*******************@news.demon.co.uk>... Brian wrote: Nathan Given wrote: <snip> Here is the error from the firefox javascript console: Error: document.getElementsByTagName("BODY")[0] has no properties.
If you have a JavaScript question, ask in a JavaScript group. I recommend comp.lang.javascript.
Fair enough, but the explanation of the error is fairly simple. A script executed inline within the HEAD section of a page executes prior to the HTML parser encountering (or implying) the opening BODY tag. As a result there is no BODY element within the DOM to refer to and - document.getElementsByTagName("BODY") - must return an empty nodeList at that point (so there is no item at index zero within that nodeList).
Richard. This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: TheKeith |
last post by:
I don't know much about javascript, so take it easy on me. Is there a way to
dynamically change a CSS layers dimensions on the fly. Here is what I'm
doing. I have a bunch of thumbnails that when...
|
by: Markus Mohr |
last post by:
Hi, everyone,
I have a special problem:
For every monitor resolution in 200 pixel steps from 800 to 1600
pixels I have an image to be shown as centered background-image.
Those images all...
|
by: Spike |
last post by:
Hello!
Im going to make a javascript for changing alot of images. But im not
sure how to do it., where to start..
Ok, first.. this is the isue.
I have 3 images(I call them 1a-3a).
when u...
|
by: Martin Nadoll |
last post by:
Hello,
is it possible to change the bg-Image of a <td>-tag onMouseOver?
maybe with javaScript or with css?
Thzankis for any help,
Martin Nadoll
|
by: Keith Smith |
last post by:
How can I change the background IMAGE (not just color) of a CELL in a table?
I know that I can do this using CSS, but I really need to be able to do it
using JavaScript. Anyone know how?
Must...
|
by: Mark |
last post by:
IE creates an object of every ID'd HTML tag (so it appears), and each
object sets a property for any parameter I set in the tag. For example,
my HTML might be: <td id='cell1'...
|
by: vj |
last post by:
how to change images based on action.
Even clicking changed images should do respective actions.
and while displaying only one image at a time sholud get displayed.
I am using three images for a...
|
by: studentofknowledge |
last post by:
hi guys
im new to javascript and need some guidence please..
im trying to display a 400x400 pixel coloured area in the middle of a webpage that stays in the middle with a browser window resize....
|
by: Jim |
last post by:
How can I use JavaScript to change a background image in a table cell?
Here's the code for the cell
<td width="338" valign="top" background="../images/
LEC_Q1.jpg"><div...
|
by: CloudSolutions |
last post by:
Introduction:
For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
|
by: Faith0G |
last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: ryjfgjl |
last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
|
by: ryjfgjl |
last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
| |