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... Quote Link to comment 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> Quote Link to comment 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.. Quote Link to comment 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 Quote Link to comment 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.. Quote Link to comment 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 Quote Link to comment 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? Quote Link to comment Share on other sites More sharing options...
adredz Posted December 14, 2009 Author Share Posted December 14, 2009 no, none at all.. Quote Link to comment 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 Quote Link to comment 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... Quote Link to comment Share on other sites More sharing options...
rajivgonsalves Posted December 14, 2009 Share Posted December 14, 2009 can you post your full code ? Quote Link to comment 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... Quote Link to comment 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 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.