javascript- hiển thị các ảnh khi mouse đi qua các link

Đoạn code js hiển thị nội dung khi mouse chạm tới các <a>.

Ngày nay khi css đã khá hoàn thiện thì hiệu ứng tương tự như thế này được giải quyết bằng css cho kết quả tốt hơn.

Tuy nhiên ngày trước thì js là cứu cánh cho rất nhiều hiệu ứng.

<SCRIPT language=javascript>
  var defaultImg = "http://png-4.findicons.com/files/icons/694/longhorn_r2/228/printers_and_faxes.png";
  function nameHover(o,img){
  o.className = 'comingwed_name_on';
  document.getElementById("comingWedThumb").src=img;
  }
  function nameOut(o){
  o.className = 'comingwed_name';
  document.getElementById("comingWedThumb").src=defaultImg;
  }
</SCRIPT>
<div id="demo-menu">
  <DIV class=comingwed_name onmouseout=nameOut(this) onmouseover="nameHover(this,'http://png-4.findicons.com/files/icons/51/capital_suite/128/img.png')">    <A title="" href="" target=_blank> - menu 1 - </A></DIV>
  <DIV class=comingwed_name onmouseout=nameOut(this) onmouseover="nameHover(this,'http://png-4.findicons.com/files/icons/67/ethereal_2/128/img.png')">    <A title="" href="" target=_blank> - menu 2 - </A></DIV>
  <DIV class=comingwed_name onmouseout=nameOut(this) onmouseover="nameHover(this,'http://png-2.findicons.com/files/icons/66/ethereal/128/img.png')">    <A title="" href="" target=_blank> - menu 3 - </A></DIV>
  <DIV class=comingwed_name onmouseout=nameOut(this) onmouseover="nameHover(this,'http://png-3.findicons.com/files/icons/1657/lha_objects/128/filetype_img.png')">    <A title="" href="" target=_blank> - menu 4 - </A></DIV>
</div>
<div id="demo-show">  <IMG id=comingWedThumb src="http://png-2.findicons.com/files/icons/39/aqcua/128/img.png"/></div>
<style>
  #demo-menu  {float: left;border:1px solid #999; width:200px; height:200px;}
  #demo-show  {float: left;border:1px solid #999; width:200px; height:200px;}
</style>

- menu 1 -

- menu 2 -

- menu 3 -

- menu 4 -