• noddy
  • Ticketholder
  • Offline
  • Registered: 2008-04-21
  • Posts: 8

Topic: Show Link in Table Cell on Mouseover

I'm working on a calendar app and have the following (prototype) javascript changing the cell background on mouse over.

document.observe('dom:loaded', function() {
            $$('#calendar td.day').each(function(item) {
                item.observe('mouseover', function() {
                    item.setStyle({ backgroundColor: '#ddd' });
                });
                item.observe('mouseout', function() {
                    item.setStyle({backgroundColor: '#fff' });
                });
            });
});

I now need to display a link inside a <span> within the cell when the mouse is over the cell. How can this be done?

Thanks

  • From: Los Angeles, California
  • Registered: 2006-12-03
  • Posts: 347

Re: Show Link in Table Cell on Mouseover

document.observe('dom:loaded', function() {
  $('calendar').select('.day').invoke("observe", "mouseover", function() {
    this.setStyle({background: '#ddd'});
    this.down('span').show();
  });
  
  $('calendar').select('.day').invoke("observe", "mouseout", function() {
    this.setStyle({background: '#fff'});
    this.down('span').hide();
  });
});

patrick99e99's Website