Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Table Backgrouund image

Status
Not open for further replies.
Mike12tet

Mike12tet

Technical User
Dec 15, 2003
24
0
0
NZ
I'm trying to update my table background image (each day new image, Monday thru Sanday). I know there is some javascript code to update images on daily basis but how can I change the background/table image? Or update an image on refresh.
Thanks for any advise.
(I know some basics of javascript.)

Michal
 
Sort by date Sort by votes
but how can I change the background/table image?
Click to expand...

If your table has an ID of, for example, "myTable", then this should work:

Code: 
document.getElementById('myTable').style.backgroundImage = 'url([URL unfurl="true"]http://www.yourdomain.com/yourNewImage.gif)';[/URL]

Hope this helps,
Dan
 
Upvote 0 Downvote
No, my table doesn't have an ID. Is there any way to get around the table name?

Thanks,

Michal
 
Upvote 0 Downvote

Then simply add an ID to your table.

Dan


The answers you get are only as good as the information you give!

 
Upvote 0 Downvote
Dan, you posted reference to "yourNewImage.gif" - is this a special image name that you can use to tell the table to use it in the background? I was just wondering what to do if the background image was a jpg (instead of a gif). Also - I tend to save my images as all lower case... will this still work? Or will I have to add upper case to my images?

Is there a naming scheme that everyone uses for ids - you both talk about using an id of myTable (although cLFlaVA uses a different case: MyTable - is there a difference). What would you do if you had 2 tables... would you just use the same id in the table?

Thanks in advance,
Jeff
 
Upvote 0 Downvote
IDs need to be unique. You'd need [tt]myTable1[/tt] and [tt]myTable2[/tt]. Capitalization does not matter with IDs, but when referencing them, it does matter. If you have an id of [tt]myTable1[/tt], then you cannot reference it in JavaScript as [tt]MyTable1[/tt].

*cLFlaVA
----------------------------
[tt]clean slate...[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
Upvote 0 Downvote
ok,
here is my code (table)

<table width="750" border="0" cellspacing="0" cellpadding="0">
<tr>
<td background="wednesday.jpg">&nbsp;</td>
</tr>
</table>

How can I update the bacground image by the day of the week (with monday.jpg, tuesday.jpg a so on), and how can I just randomly update the background image?

Thanks,

Michal
 
Upvote 0 Downvote
file names:

[tt]
day0.jpg
day1.jpg
day2.jpg
day3.jpg
day4.jpg
day5.jpg
day6.jpg
[/tt]

function:
Code: 
function getPic() {
    var d = new Date();
    var n = d.getDay();
    var t = document.getElementById('myCell');
    t.style.background = 'transparent url(day' + n + '.jpg)';
}

body:
Code: 
<body onload="getPic();">

table:
Code: 
<table ...>
  <td id="myCell">...</td>
</table>

*cLFlaVA
----------------------------
[tt]clean slate...[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
Upvote 0 Downvote
Adam-

Unfortunately, you need to subscribe to yourdomain.com in order to use this script.

Please send three easy payments of $29.95 to the address located on my website. I'll set you up with an account immediately.

*cLFlaVA
----------------------------
[tt]clean slate...[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
Upvote 0 Downvote

Michal,

Now that the background image has moved from the table to a cell, you will no longer need to put the ID on the table... you'll need to put it on the cell instead, such as cLFlaVA has shown.

Hope this helps,
Dan


The answers you get are only as good as the information you give!

 
Upvote 0 Downvote
It makes sence now.
Below is my code, does it look OK to you guys? It wont show the background image. I have my images domain/dayFriday.jpg and so on.
Any advice guys?

Thanks in advance

Michal

<head>
<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
function getPic() {
var d = new Date();
var n = d.getDay();
var t = document.getElementById('myCell');
t.style.background = ' + n + '.jpg)';
}

// End -->
</script>

</head>

<body onload="getPic();">

<table width="700" height="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td id="myCell">&nbsp;</td>
</tr>
</table>
</body>
 
Upvote 0 Downvote
I would say that this:

Code: 
t.style.background = '[URL unfurl="true"]http://www.domain.com/(day'[/URL] + n + '.jpg)';

needs to be replaced with this:

Code: 
t.style.backgroundImage = 'url([URL unfurl="true"]http://www.domain.com/day'[/URL] + n + '.jpg)';

You need to name your images day0.jpg through to day6.jog, not dayMonday.jpg through to daySunday.jpg.

Hope this helps,
Dan



The answers you get are only as good as the information you give!
 
Upvote 0 Downvote
Dan,

Thank you, I got work. Thanks for your help and mainly for your patience with me.

Michal
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
154
lexer
lexer
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
155
malpa
malpa
coldbohemia
  • Locked
  • Question
jquery function always returns contents of the same table cell, no matter which table cell i click
Replies
0
Views
137
coldbohemia
coldbohemia
waubain
  • Locked
  • Question
First image in slide gallery not showing - Uncaught TypeError: slides[(slideIndex - 1)] is undefined 1
Replies
2
Views
111
waubain
waubain
TheLazyPig
  • Locked
  • Question
Copy details of searched reference to table using Angular JS
Replies
0
Views
40
TheLazyPig
TheLazyPig

Part and Inventory Search

Sponsor

Back
Top