Thread

Does anyone know how I can manage to do the following:
http://www.myvouchercodes.co.uk/discounts/totalpda.co.uk

If you can see it obscures the discount code below a div and doesnt display it under you click the button. Anyone know how I can do that… I dont know javascript or enough css to do it.

Cheers
Robert

You’ll have to use some javascript and some css will be required. I suggest using Prototype Framework (http://prototypejs.org/) and script.aculo.us together to do what you want to. Its very easy you can do it with some lines of coding using above two frameworks.

If you use jQuery it’s simple to reveal your discountcode

$('div.voucher_button a').bind('click',function(){
    $(this).hide();
});

And just to show how easy and still good looking jQuery is - here is how to toggle it:

$('div.voucher_button a').click(function () {
      $('#target').slideToggle('slow');
});

http://docs.jquery.com/Effects/slideToggle

Have a look into jQuery - heaps of stuff that makes javacsript stuff like this very simple to do!

Hi I created a hide or show function for you with easy javascript

all you do is feed it 2 arguments the div id and the event you want either hide or show

function hide_show(id,event)
{

  var div=document.getElementById(id);
  switch(event) 
  {
    
    case "show":
      div.style.display="block";
    break;    
    case "hide":
      div.style.display="none";
    break;
    default:
      alert("error");
   }
}

then in your div you would initially set up as display none then you add this function to an onclick event handler to one of your hyper links <a href=# onclick=“hide_show(‘id’,‘show’)”> click here to show</a>

like that

I could have used a if statement or even a ternary operator but I chose the switch for a switch