heldenbrau Posted August 17, 2010 Share Posted August 17, 2010 if (document.getElementById('plus').style.background=='url('/images/minus.png')'){ document.getElementById('plus').style.background='url('/images/plus.png')'; } else { document.getElementById('plus').style.background='url('/images/minus.png')'; } This is to change a + button to a _ button when it is clicked Quote Link to comment Share on other sites More sharing options...
Alex Posted August 17, 2010 Share Posted August 17, 2010 Try: if (document.getElementById('plus').style.background=="url('/images/minus.png')"){ document.getElementById('plus').style.background="url('/images/plus.png')"; } else { document.getElementById('plus').style.background="url('/images/minus.png')"; } If you're gonna use single quotes inside single quotes you need to escape them. In this case it's just easier to use double quotes. For future reference when posting code you should use [php] or [code] tags. Quote Link to comment Share on other sites More sharing options...
heldenbrau Posted August 17, 2010 Author Share Posted August 17, 2010 The trouble is this is inside an onclick so is already encased in "". Quote Link to comment Share on other sites More sharing options...
AtlasC1 Posted August 17, 2010 Share Posted August 17, 2010 Rewrite it as a function. You'll save a lot of headache, and the code will be cleaner: function toggleBg() { if (document.getElementById('plus').style.background=="url('/images/minus.png')"){ document.getElementById('plus').style.background="url('/images/plus.png')"; } else { document.getElementById('plus').style.background="url('/images/minus.png')"; } } And on the HTML element your using to trigger this event, use onClick="toggleBg();" -jm Quote Link to comment Share on other sites More sharing options...
heldenbrau Posted August 17, 2010 Author Share Posted August 17, 2010 I can't call it as a function because it is inside a PHP script and the ('plus') is really ('plus$count') if I call it as a function, the $count won't mean anything. Quote Link to comment Share on other sites More sharing options...
AtlasC1 Posted August 17, 2010 Share Posted August 17, 2010 That shouldn't matter; you can pass $count as a variable: function toggleBg(plus) { if (document.getElementById(plus).style.background=="url('/images/minus.png')"){ document.getElementById(plus).style.background="url('/images/plus.png')"; } else { document.getElementById(plus).style.background="url('/images/minus.png')"; } } and use onClick="toggleBg('plus{$count}')" I don't know what your code looks like, so I can't help you with the escape sequences for the quotes, but that shouldn't be hard to figure out. -jm Quote Link to comment Share on other sites More sharing options...
heldenbrau Posted August 17, 2010 Author Share Posted August 17, 2010 Thanks for your help. I have put it in as a function now, but it still isn't working the function comes out on the webpage source as toggleBg('plus33') which is the right number, so it should work if 'plus33' goes in the brackets. It is part of a bigger javascript, I will post that, but I can't post the whole thing, it is massive. It is $clicker btw not $count, but I've changed that. Here is the function and the onclick part. <script type="text/javascript"> function toggleBg(){ if (document.getElementById('plus').style.background=="url('/images/minus.png')"){ document.getElementById('plus').style.background="url('/images/plus.png')"; } else { document.getElementById('plus').style.background="url('/images/minus.png')"; } </script> onclick=" if (document.getElementById('rev$clicker').style.display=='block'){ document.getElementById('rev$clicker').style.display='none'; } else { document.getElementById('rev$clicker').style.display='block'; } if (document.getElementById('box$clicker').style.display=='block'){ document.getElementById('box$clicker').style.display='none'; } else { document.getElementById('box$clicker').style.display='block'; } if (document.getElementById('revb$clicker').style.display=='block'){ document.getElementById('revb$clicker').style.display='none'; } else { document.getElementById('revb$clicker').style.display='block'; } if (document.getElementById('boxb$clicker').style.display=='block'){ document.getElementById('boxb$clicker').style.display='none'; } else { document.getElementById('boxb$clicker').style.display='block'; } toggleBg('plus{$clicker}') } "/> Quote Link to comment Share on other sites More sharing options...
heldenbrau Posted August 18, 2010 Author Share Posted August 18, 2010 Sorry just seen I have forgot to add (plus) and the curly brackets {} I have now copied and pasted what you put and now it works. But now the minus sign doesn't change back to a cross. The main issue is solved though. 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.