Display left and right arrows on pictures similar to page turning code_javascript skills

Use JS to implement the page turning code that displays the left and right arrows on the picture. The preview URL is: http://www.keleyi.com/keleyi/phtml/picnext/
This example uses the onmousemove event of javascript. The onmousemove event occurs when the mouse pointer moves.

Syntax
onmousemove="SomeJavaScriptCode"
SomeJavaScriptCode is a required parameter. Specifies the JavaScript to be executed when this event occurs.

The following is the core code (please view the source code on the effect page for the complete code):

Copy code The code is as follows:

<script type="text/javascript">
function KeleyiImgNext(bigimg) {
var lefturl = "01.html";
var righturl ="03.html";
var imgurl = righturl;
var width = bigimg.width;
var height = bigimg.height;
bigimg.onmousedown = bigimg.onmousemove = function () {
if (event.offsetX < width / 2) {
imgurl = lefturl;
if (imgurl != "#")
bigimg.style.cursor = 'url( images/arr_left.cur),auto';
else
bigimg.style.cursor = 'default';
} else {
imgurl = righturl;
if (imgurl != '# ')
bigimg.style.cursor = 'url(images/arr_right.cur),auto';
else
bigimg.style.cursor = 'default';
}
}
bigimg.onmouseup = function () {
if (imgurl != '#')
top.location = imgurl;
}
}
</script>
<img onmouseover="KeleyiImgNext(this)" src="http://www.keleyi.com/keleyi/phtml/picnext/images/k02.jpg" alt="keleyi" />