<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML> <HEAD> <TITLE></TITLE> <mce:style><!-- html,body{ background:#e0e0e0; } .imgBox img{ border:1px dashed #666; } .imgBox{ position: relative; float:left; } .imgBox div{ position:absolute; left:0px; top:0px; width:50%; height:98%; background: #fff; opacity:0.0; filter:alpha(opacity=0); } .imgBox .left{ cursor: url('/photo/cursor/pre.cur'),default; } .imgBox .right{ left:50%; cursor: url('/photo/cursor/next.cur'),default; } --></mce:style><style mce_bogus="1"> html,body{ background:#e0e0e0; } .imgBox img{ border:1px dashed #666; } .imgBox{ position: relative; float:left; } .imgBox div{ position:absolute; left:0px; top:0px; width:50%; height:98%; background: #fff; opacity:0.0; filter:alpha(opacity=0); } .imgBox .left{ cursor: url('/photo/cursor/pre.cur'),default; } .imgBox .right{ left:50%; cursor: url('/photo/cursor/next.cur'),default; } </style> </HEAD> <BODY> <div class="imgBox"> <img src="http://www.w3schools.com/images/pulpit.jpg" mce_src="http://www.w3schools.com/images/pulpit.jpg"/> <div class="left" οnclick="alert('left');"> </div> <div class="right" οnclick="alert('right');"> </div> </div> </BODY> </HTML>