nV News Forums

 
 

nV News Forums (http://www.nvnews.net/vbulletin/index.php)
-   Software Development (http://www.nvnews.net/vbulletin/forumdisplay.php?f=53)
-   -   JavaScript Help (http://www.nvnews.net/vbulletin/showthread.php?t=92021)

technoid 05-23-07 01:42 PM

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)';
}
}

evilghost 05-23-07 01:46 PM

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+")'");

fivefeet8 05-23-07 11:12 PM

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.

technoid 05-25-07 03:22 PM

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.

technoid 05-25-07 03:32 PM

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!


All times are GMT -5. The time now is 06:51 PM.

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