deepson2 Posted July 20, 2009 Share Posted July 20, 2009 Hello, I wanted to show on hover my record list. But it seems its not working. can anyone see my code and tell me what is wrong am doing? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script> /* when the dom is ready... */ window.addEvent('domready',function() { /* hide all controls right away */ $$('div.record-controls').setStyle('visibility','hidden'); /* add events for show/hide */ $$('div.record').each(function(rec) { var controls = rec.getFirst('div.record-controls'); rec.addEvents({ mouseenter: function() { controls.fade('in') }, mouseleave: function() { controls.fade('out') } }); }); }); </script> <style> <link > .record { width:700px; border:1px solid #ccc; padding:15px; margin:0 0 15px 0; } .record:hover { background:#eee; } .record-controls { font-size:10px; } .unapprove { color:#d98500; } .delete { color:#bc0b0b; } </style> </head> <body> <!-- more records above --> <div class="record"> <p> <strong>Comment Person 2</strong><br /> Hello world! </p> <div class="record-controls"> <a href="#" class="unapprove">Unapprove</a> | <a href="#">Edit</a> | <a href="#">Reply</a> | <a href="#">Spam</a> | <a href="#" class="delete">Delete</a> </div> </div> <div class="record"> <p> <strong>Comment Person 3</strong><br /> hello! </p> <div class="record-controls"> <a href="#" class="unapprove">Unapprove</a> | <a href="#">Edit</a> | <a href="#">Reply</a> | <a href="#">Spam</a> | <a href="#" class="delete">Delete</a> </div> </div> <!-- more records below --> </body> </html> Thanks in advance. Link to comment https://forums.phpfreaks.com/topic/166590-on-hover-show-the-list/ Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.