Go Back   nV News Forums > Software Forums > Software Development

Newegg Daily Deals

Reply
 
Thread Tools
Old 05-23-07, 02:42 PM   #1
technoid
Registered User
 
Join Date: Jul 2004
Location: Denton, Texas
Posts: 505
Default JavaScript Help

I'm doing some webpage work and need to change the background image of a div and need to decide what image to use at runtime. So I want to use a variable when I change the background image. Here's what I'm doing and what I want to change for it to work like I want it to. I put all the info in the comments. The basic problem is I can't get a variable to work when I set the background image path. Any help would be appreciated.

// What I'm doing now
function changeBGImage(div_id, btn_state)
{
if(btn_state == 'up')
{
document.getElementById(div_id).style.backgroundIm age = 'url(graphics/btn-unselected.gif)';
}
if(btn_state == 'dn')
{
document.getElementById(div_id).style.backgroundIm age = 'url(graphics/btn-selected.gif)';
}
}

// What I want to do but doesn't work
//
// I want to set the button image at runtime to
// different buttons from different locations. So
// basically I want to use a variable when I set
// the background image of the div. I don't have
// much experience doing this so if you can help
// I'd really appreciate it.
//
function changeBGImage(div_id, btn_state)
{
var root_path = getRootPath();
if(btn_state == 'up')
{
var btn_path = root_path + 'graphics/btn-unselected.gif';
document.getElementById(div_id).style.backgroundIm age = 'url(btn_path)';
}
if(btn_state == 'dn')
{
var btn_path = root_path + 'graphics/btn-selected.gif';
document.getElementById(div_id).style.backgroundIm age = 'url(btn_path)';
}
}
__________________
Antec-SOLO | ASUS-P5Q-SE | C2D-E8600 | AC-Freezer-7-Pro | Seasonic-S12-550W | 3GB-KVR-PC2-6400 | GTX-560Ti | SB-XtremeGamer | Pioneer-BDR-205 | Samsung-S223B | Dell-U2412M
technoid is offline   Reply With Quote
Old 05-23-07, 02:46 PM   #2
evilghost
Registered User
 
Join Date: Jul 2005
Posts: 3,606
Default Re: JavaScript Help

Quote:
Originally Posted by technoid
I'm doing some webpage work and need to change the background image of a div and need to decide what image to use at runtime. So I want to use a variable when I change the background image. Here's what I'm doing and what I want to change for it to work like I want it to. I put all the info in the comments. The basic problem is I can't get a variable to work when I set the background image path. Any help would be appreciated.

// What I'm doing now
function changeBGImage(div_id, btn_state)
{
if(btn_state == 'up')
{
document.getElementById(div_id).style.backgroundIm age = 'url(graphics/btn-unselected.gif)';
}
if(btn_state == 'dn')
{
document.getElementById(div_id).style.backgroundIm age = 'url(graphics/btn-selected.gif)';
}
}

// What I want to do but doesn't work
//
// I want to set the button image at runtime to
// different buttons from different locations. So
// basically I want to use a variable when I set
// the background image of the div. I don't have
// much experience doing this so if you can help
// I'd really appreciate it.
//
function changeBGImage(div_id, btn_state)
{
var root_path = getRootPath();
if(btn_state == 'up')
{
var btn_path = root_path + 'graphics/btn-unselected.gif';
document.getElementById(div_id).style.backgroundIm age = 'url(btn_path)';
}
if(btn_state == 'dn')
{
var btn_path = root_path + 'graphics/btn-selected.gif';
document.getElementById(div_id).style.backgroundIm age = 'url(btn_path)';
}
}
You need to use the eval function:
Code:
eval("document.getElementById("+div_id+").style.backgroundImage = 'url("+btn_path+")'");
evilghost is offline   Reply With Quote
Old 05-24-07, 12:12 AM   #3
fivefeet8
Ngemu Mod
 
Join Date: Jul 2003
Location: Fresno, CA
Posts: 1,886
Default Re: JavaScript Help

Code:
document.getElementById(div_id).style.backgroundImage = 'url(btn_path)';
You're treating the javascript variable name as a string. It will not evaluate to a variable this way, but into the actual string: "url(btn_path)". And the CSS attribute would be:

Code:
div{
background-image: url(btn_path);
}
Replace with:

Code:
document.getElementById(div_id).style.backgroundImage = 'url("'+btn_path+'")';
Since it's concantenated, the javascript variable remains a variable with the appropriate value and the whole string evaluates correctly.
__________________
[i7 2600k @4.4ghertz][2x4 GB DDR3 1600][EVGA GTX570 1.280GB SC][EVGA GTX460 physx][Asrock Extreme7 Gen3 Z68][2xSeagate 160 Gb SATA HD raid0][Seagate 250 GB SATA2 HD][Sony Bravia 40' 1080p LCD HDTV][NEC 3520a DVD+-DLw][Windows 7 Ultimate x64][Rosewill 1000w]

Last edited by fivefeet8; 05-25-07 at 12:02 PM.
fivefeet8 is offline   Reply With Quote
Old 05-25-07, 04:22 PM   #4
technoid
Registered User
 
Join Date: Jul 2004
Location: Denton, Texas
Posts: 505
Default Re: JavaScript Help

Quote:
Originally Posted by evilghost
You need to use the eval function:
Code:
eval("document.getElementById("+div_id+").style.backgroundImage = 'url("+btn_path+")'");
Thanks for your help. I might have done something wrong but I got an object expected error.
__________________
Antec-SOLO | ASUS-P5Q-SE | C2D-E8600 | AC-Freezer-7-Pro | Seasonic-S12-550W | 3GB-KVR-PC2-6400 | GTX-560Ti | SB-XtremeGamer | Pioneer-BDR-205 | Samsung-S223B | Dell-U2412M
technoid is offline   Reply With Quote
Old 05-25-07, 04:32 PM   #5
technoid
Registered User
 
Join Date: Jul 2004
Location: Denton, Texas
Posts: 505
Default Re: JavaScript Help

Quote:
Originally Posted by fivefeet8
Replace with:

Code:
document.getElementById(div_id).style.backgroundImage = 'url("'+btn_path+'")';
Since it's concantenated, the javascript variable remains a variable with the appropriate value and the whole string evaluates correctly.
Thanks a lot that was exactly what I needed. In the mean time I got this to work since it took a variable ok.

document.getElementById(id).src = imgsrc;

But I like your way better and will use it because it works the way I wanted to do it but got messed up with the string variable getting evaluated wrong. Thanks Again!
__________________
Antec-SOLO | ASUS-P5Q-SE | C2D-E8600 | AC-Freezer-7-Pro | Seasonic-S12-550W | 3GB-KVR-PC2-6400 | GTX-560Ti | SB-XtremeGamer | Pioneer-BDR-205 | Samsung-S223B | Dell-U2412M
technoid is offline   Reply With Quote
Reply


Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -5. The time now is 10:10 AM.


Powered by vBulletin® Version 3.7.1
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.
Copyright 1998 - 2014, nV News.