adredz Posted December 14, 2009 Share Posted December 14, 2009 Have a div that already changes its background onmouseover and onmouseout which was done through simple CSS. Now I want to add an effect that when the div gets clicked it retains the image used onmouseover. I implemented it via javascript but I can't seem to make it work. Here's my code: div html: <div id="content_1_1"><a href="javascript:changeBg('content_1_1');"> </a> nothing</div> js function: function changeBg(content){ document.getElementById('content').style.backgroundImage = "url('images/itembg_on.jpg')"; } any help would be appreciated... Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/ Share on other sites More sharing options...
rajivgonsalves Posted December 14, 2009 Share Posted December 14, 2009 your code should be function changeBg(content){ document.getElementById('content').style.backgroundImage = "url(images/itembg_on.jpg)"; } also your anchor should contain some text it will be easier to click <div id="content_1_1"><a href="javascript:changeBg('content_1_1');"> nothing </a></div> Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977071 Share on other sites More sharing options...
adredz Posted December 14, 2009 Author Share Posted December 14, 2009 It's not working.. Tried removing the '' from the getElemeentById parameter: function changeBg(content){ document.getElementById(content).style.backgroundImage = "url(images/itembg_on.jpg)"; } And replaced the function call method through the onlick attribute of div: <div id="content_1_1" onclick="changeBg(this.id)"> It does have an effect, but it removes the bg instead of replacing it. It has successfully called the function right? If so what's the problem? The image path is certainly /images/itembg_on.jpg.. Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977093 Share on other sites More sharing options...
rajivgonsalves Posted December 14, 2009 Share Posted December 14, 2009 which browser are you checking in I tried it out and it worked in FF 3.5 , try giving the full path of the image and see if it makes any difference Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977094 Share on other sites More sharing options...
adredz Posted December 14, 2009 Author Share Posted December 14, 2009 same, tried it with Chrome too but no luck.. Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977096 Share on other sites More sharing options...
rajivgonsalves Posted December 14, 2009 Share Posted December 14, 2009 do you have any javascript errors on the page ? if there is an error it won't execute any javascript Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977098 Share on other sites More sharing options...
adredz Posted December 14, 2009 Author Share Posted December 14, 2009 tried the full path.. doesn't work still. maybe it has something to do with WordPress, no? Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977101 Share on other sites More sharing options...
adredz Posted December 14, 2009 Author Share Posted December 14, 2009 no, none at all.. Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977102 Share on other sites More sharing options...
rajivgonsalves Posted December 14, 2009 Share Posted December 14, 2009 how big is the image what are the dimensions it could be possible its too big for the div Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977104 Share on other sites More sharing options...
adredz Posted December 14, 2009 Author Share Posted December 14, 2009 Actually the image i'd like to use for the active is the same as the hover's which is perfectly working. I tried it in IE with no luck... Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977107 Share on other sites More sharing options...
rajivgonsalves Posted December 14, 2009 Share Posted December 14, 2009 can you post your full code ? Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977109 Share on other sites More sharing options...
adredz Posted December 14, 2009 Author Share Posted December 14, 2009 I think this has something to do with wordpress since I had trouble implementing the same thing for my dynamic nav menu. I had to host the image to the internet to get the desired effect. I think may have found a solution while writing this... Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977110 Share on other sites More sharing options...
adredz Posted December 14, 2009 Author Share Posted December 14, 2009 Nailed it.. so this was all about wordpress Thanks rajiv for time Link to comment https://forums.phpfreaks.com/topic/185081-simple-change-div-image-background-cant-make-it-work/#findComment-977114 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.