<!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> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>图片上左右箭头翻页代码_布士收藏夹</title> </head> <body style="text-align:center"> <script> function upNext(bigimg){ var lefturl = '01.html'; var righturl = '03.html'; var imgurl = righturl; var width = bigimg.width; var height = bigimg.height; bigimg.onmousemove=function(){ if(event.offsetX<width/2){ bigimg.style.cursor = 'url(images/arr_left.cur),auto'; imgurl = lefturl; }else{ bigimg.style.cursor = 'url(images/arr_right.cur),auto'; imgurl = righturl; } } bigimg.onmouseup=function(){ top.location=imgurl; } } </script> <img onmouseover="upNext(this)" src="images/02.jpg" /> <div style="width:550px;margin:20px auto;"> <p><strong><a href="http://www.endbus.cn">布士收藏夹整理</a></strong> <a href="http://www.endbus.cn/" target="_blank">js小程序</a></p> <p>JS实现的图片上左右箭头翻页,代码精简易用,推荐下载!!</p> </div> </body> </html>
小程序演示:endbus.net/demo/js/jstonextup/
评论