js实现鼠标悬停图片上时滚动文字说明的方法


Posted in Javascript onFebruary 17, 2015

本文实例讲述了js实现鼠标悬停图片上时滚动文字说明的方法。分享给大家供大家参考。具体实现方法如下:

<html>

<title>js实现鼠标悬停图片上时的滚动文字说明</title>

<body>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

function showtip2(current,e,text){

  if (document.all&&document.readyState=="complete"){

    document.all.tooltip2.innerHTML='<marquee style="border:1px solid black">'+text+'</marquee>'

    document.all.tooltip2.style.pixelLeft=event.clientX+document.body.scrollLeft+10

    document.all.tooltip2.style.pixelTop=event.clientY+document.body.scrollTop+10

    document.all.tooltip2.style.visibility="visible"

}

  else if (document.layers){

    document.tooltip2.document.nstip.document.write('<b>'+text+'</b>')

    document.tooltip2.document.nstip.document.close()

    document.tooltip2.document.nstip.left=0

    currentscroll=setInterval("scrolltip()",100)

    document.tooltip2.left=e.pageX+10

    document.tooltip2.top=e.pageY+10

    document.tooltip2.visibility="show"

}

}

function hidetip2(){

  if (document.all)

    document.all.tooltip2.style.visibility="hidden"

    else if (document.layers){

    clearInterval(currentscroll)

    document.tooltip2.visibility="hidden"

}

}

//  End -->

</script>

<div id="tooltip2" style="position:absolute;visibility:hidden;clip:rect(0 150 50 0);width:150px;background-color:gold;z-index:10"></div>

<div align="CENTER" name="divTest" onMouseover="showtip2(this,event,'欢迎来到三水点靠木');" onMouseout="hidetip2();" STYLE="cursor: hand">

<TABLE border="0" cellpadding="0" cellspacing="0"><TR><TD COLSPAN="7">

<img SRC="/images/banner.gif" BORDER="0" style="cursor:pointer;"/>

</TABLE>

</div>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
日期函数扩展类Ver0.1.1
Sep 07 Javascript
jquery中one()方法的用法实例
Jan 16 Javascript
JS验证逗号隔开可以是中文字母数字
Apr 22 Javascript
Node.js返回JSONP详解
May 18 Javascript
js字符串与Unicode编码互相转换
May 17 Javascript
Three.js中网格对象MESH的属性与方法详解
Sep 27 Javascript
微信小程序实现鼠标拖动效果示例
Dec 01 Javascript
webpack多页面开发实践
Dec 18 Javascript
js实现微信/QQ直接跳转到支付宝APP打开口令领红包功能
Jan 09 Javascript
微信小程序导入Vant报错VM292:1 thirdScriptError的解决方法
Aug 01 Javascript
Javascript实现简易天数计算器
May 18 Javascript
微信小程序报错: thirdScriptError的错误问题
Jun 19 Javascript
js鼠标滑过图片震动特效的方法
Feb 17 #Javascript
js实现双击图片放大单击缩小的方法
Feb 17 #Javascript
js图片模糊切换显示特效的方法
Feb 17 #Javascript
js实现单击图片放大图片的方法
Feb 17 #Javascript
js实现iframe自动自适应高度的方法
Feb 17 #Javascript
js全选实现和判断是否有复选框选中的方法
Feb 17 #Javascript
Jquery树插件zTree用法入门教程
Feb 17 #Javascript
You might like
《超神学院》霸气归来, 天使彦上演维多利亚的秘密
2020/03/02 国漫
php在线生成ico文件的代码
2007/10/09 PHP
在线游戏大家来找茬II
2006/09/30 Javascript
jQuery初学:find()方法及children方法的区别分析
2011/01/31 Javascript
JS实现切换标签页效果实例代码
2013/11/01 Javascript
跟我学习javascript的闭包
2015/11/16 Javascript
Javascript编程之继承实例汇总
2015/11/28 Javascript
带有定位当前位置的百度地图前端web api实例代码
2016/06/21 Javascript
jQuery.ajax实现根据不同的Content-Type做出不同的响应
2016/11/03 Javascript
详解vue.js组件化开发实践
2016/12/14 Javascript
JS实现颜色动态淡化效果
2017/03/06 Javascript
js canvas实现放大镜查看图片功能
2017/06/08 Javascript
jQuery实现每日秒杀商品倒计时功能
2019/09/06 jQuery
基于vue+element实现全局loading过程详解
2020/07/10 Javascript
js实现缓动动画
2020/11/25 Javascript
[09:43]DOTA2每周TOP10 精彩击杀集锦vol.5
2014/06/25 DOTA
[44:40]Serenity vs Pain 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
用Python编写web API的教程
2015/04/30 Python
python开发之tkinter实现图形随鼠标移动的方法
2015/11/11 Python
Python基于辗转相除法求解最大公约数的方法示例
2018/04/04 Python
详解从Django Rest Framework响应中删除空字段
2019/01/11 Python
python scatter散点图用循环分类法加图例
2019/03/19 Python
Python向excel中写入数据的方法
2019/05/05 Python
python super用法及原理详解
2020/01/20 Python
使用python 计算百分位数实现数据分箱代码
2020/03/03 Python
python 中的命名空间,你真的了解吗?
2020/08/19 Python
Python urllib库如何添加headers过程解析
2020/10/05 Python
OLEDBConnection和SQLConnection有什么区别
2013/05/31 面试题
小学生元旦感言
2014/02/26 职场文书
学校文明单位申报材料
2014/05/06 职场文书
基于go interface{}==nil 的几种坑及原理分析
2021/04/24 Golang
Python打包为exe详细教程
2021/05/18 Python
python 经纬度求两点距离、三点面积操作
2021/06/03 Python
Win11如何修改dns?Win11修改dns图文教程
2022/01/18 数码科技
Python图像处理库PIL详细使用说明
2022/04/06 Python
Python编写车票订购系统 Python实现快递收费系统
2022/08/14 Python