图片上显示左右箭头的翻页js代码

本实例使用了javascript的onmousemove 事件。onmousemove 事件会在鼠标指针移动时发生。

语法
onmousemove="SomeJavaScriptCode"
SomeJavaScriptCode是必需参数。规定该事件发生时执行的 JavaScript。

下面是核心代码(完整代码请在效果页面查看源代码):

 代码如下 复制代码

<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="k02.jpg" alt="keleyi" />

时间: 2024-11-02 18:48:13

图片上显示左右箭头的翻页js代码的相关文章

要求 图片循环滚动 左右控制,鼠标指针放到图片上显示该图片的名称,下面代码在ie8下正常显示,但在ie6 ie7下显示不正常

问题描述 要求图片循环滚动左右控制,鼠标指针放到图片上显示该图片的名称,下面代码在ie8下正常显示,但在ie6ie7下显示不正常!请各位大侠帮下小弟!另发现在ie8下第一遍图片滚动完毕后第二遍图片下面没有显示文字<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlx

jquery cycle js-jquery.cycle.js进行图片切换的时候如何在图片上显示标题

问题描述 jquery.cycle.js进行图片切换的时候如何在图片上显示标题 jquery.cycle.js进行图片切换的时候如何在图片上显示标题

鼠标放在图片上显示大图的JS代码_javascript技巧

显示大图和隐藏大图的js代码: 复制代码 代码如下: <script type="text/javascript">   //显示图片   function over(imgid,obj,imgbig)   {//大图显示的最大尺寸  4比3的大小  400 300maxwidth=400;maxheight=300; //显示        obj.style.display="";        imgbig.src=imgid.src;      

jsp使用jstl实现翻页实例代码

 这篇文章主要介绍了jsp 使用jstl实现翻页实例代码,有需要的朋友可以参考一下 使用jstl进行显示相对使用jsp来说代码更显得整齐,也使代码量显得较少    代码如下: <%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@taglib prefix="c"  uri = &quo

Asp.net图片上传实现预览效果的简单代码

这篇文章介绍了Asp.net图片上传实现预览效果的简单代码,有需要的朋友可以参考一下   在页面上放入一个上传控件和一个图片控件. 复制代码 代码如下:  <asp:FileUpload ID="FileUpload1" runat="server" onpropertychange="show(this.value)"/>         <asp:Image ID="Image1" runat="

网页翻页特效代码无法实现

问题描述 网页翻页特效代码无法实现 我用这段代码实现网页翻页特效:meta HTTP-EQUIV="Page-Enter" CONTENT="revealtrans(duration=1.0, transition=23)".但不知道怎么回事,在安装有的系统后这个特效却看不到,该如何解决,请高手指点! 解决方案 浏览器是不是同一个,是不是不支持的问题 解决方案二: 同意1楼 是不是浏览器兼容性的问题 多试几个浏览器

js控制键盘左右键翻页特效代码

例1  代码如下 复制代码 <SCRIPT language=javascript> document.onkeydown = pageEvent; var prevpage="http://www.111cn.net/"; var nextpage="http://www.111cn.net/"; function pageEvent(evt){ evt = evt ||window.event; var key=evt.which||evt.keyC

javascript 图片上一张下一张链接效果代码_图象特效

贴个实现方法: 代码 复制代码 代码如下: <!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> <title&g

Js实现网页键盘控制翻页程序代码

举例:  代码如下 复制代码 <a id="last" href="<?=$lefturl?>">上一章</a> <a id="booklist" href="<?=$booklisturl?>">返回目录</a> <a id="next" href="<?=$righturl?>">下一章&