关于onmouserout的信息
怎么编写和调用js文件
需要准备的材料分别有:电脑、html编辑器、浏览器。
1、首先,打开html编辑器,新建html文件,例如:index.html,填充问题基础代码。
2、在index.js中,实现func1和func2函数。
3、在index.html中,新增第3个button,并调用func3()方法,并在script标签中输入js代码:
function func3() {
$('body').append('use func3br/');
}
4、浏览器运行index.html页面,此时点击“函数3”按钮,能正常执行func3函数来输出内容。
怎样出现鼠标经过就变颜色的表格?
用这句吧:onmouseover="this.style.background='#222'; " onmouseout ="this.style.background=''; this.style.borderColor=''"
下面这个是完整例子:)
html
head
meta http-equiv="Content-Type" content="tet/html; charset=gb2312"
meta name="GENERATOR" content="Microsoft FrontPage 4.0"
meta name="ProgId" content="FrontPage.Editor.Document"
titleNew Page/title
style
!--
body { font-size: 8pt; font-family: Tahoma }
td { font-size: 8pt; font-family: Tahoma; padding: 2 }
--
/style
/head
body
div align="center"
center
table border="1" width="400" cellspacing="0" cellpadding="0"
tr onmouseover="this.style.background='#222'; " onmouseout ="this.style.background=''; this.style.borderColor=''"
td width="49"X/td
td width="49"X/td
td width="50"X/td
td width="50"X/td
td width="50"X/td
td width="50"X/td
td width="50"X/td
td width="50"X/td
/tr
tr onmouseover="this.style.background='#222'; " onmouseout ="this.style.background=''; this.style.borderColor=''"
td width="49"X/td
td width="49"X/td
td width="50"X/td
td width="50"X/td
td width="50"X/td
td width="50"X/td
td width="50"X/td
td width="50"X/td
/tr
/table
/center
/div
/body
/html
求救啊,用js实现图片左右滚动,鼠标经过图像会在滚动图像下方的固定位置显示放大图像,速度啊!!!!!
!--
在图片标签里添加onmouseover事件,并且将该图片地址作为参数传给show_big函数
--
meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /
div align='center' id='demo' style='overflow:hidden;height:125px;width:740px;'!--滚动区的高度和宽度--
table align='center' cellpadding='0' border='0'
tr
td id='demo1' valign='top'
table width='100%' cellpadding='0' cellspacing='0' border='0' align='center'
tr valign='top'
td align='center'
TABLE width=100% border=0 align=center cellPadding=0 cellSpacing=0
TR
TD background="image/bg_03.gif"?/TD
TD width="105" height="85" align="center" bgcolor="#E9E9E9"
a href="?action=showproductid=2" target=_blank title='免费上网卡'
img src="goods/201085233124824.jpg" alt="免费上网卡" width="105" height="80" border="0" onload="javascript:DrawImage(this);" onmouseover="show_big('t')"/a
/TD
TD background="image/bg_03.gif"?/TD
TD width="105" height="85" align="center" bgcolor="#E9E9E9"
a href="?action=showproductid=3" target=_blank title='最新款语音监听器'
img src="goods/2010322133233752.jpg" alt="最新款语音监听器" width="105" height="80" border="0" onload="javascript:DrawImage(this);" onmouseover="show_big('t')"/a
/TD
TD background="image/bg_03.gif"?/TD
TD width="105" height="85" align="center" bgcolor="#E9E9E9"
a href="?action=showproductid=4" target=_blank title='远拍王'
img src="goods/20104557186.jpg" alt="远拍王" width="105" height="80" border="0" onload="javascript:DrawImage(this);" onmouseover="show_big('t')"/a
/TD
TD background="image/bg_03.gif"?/TD
TD width="105" height="85" align="center" bgcolor="#E9E9E9"
a href="?action=showproductid=8" target=_blank title='手电筒摄像机'
img src="goods/20103845747868.jpg" alt="手电筒摄像机" width="105" height="80" border="0" onload="javascript:DrawImage(this);"/a
/TD
TD background="image/bg_03.gif"?/TD
TD width="105" height="85" align="center" bgcolor="#E9E9E9"
a href="?action=showproductid=9" target=_blank title='打火机摄像机'
img src="goods/2009115195532598.jpg" alt="打火机摄像机" width="105" height="80" border="0" onload="javascript:DrawImage(this);"/a
/TD
/TR
/TABLE
/td
/tr
/table
/td
td id=demo2 valign=top/td
/tr
/table
/div
div id="bimg"/div
script
var Picspeed=15
demo2.innerHTML=demo1.innerHTML
function Marquee1(){
if(demo2.offsetWidth-demo.scrollLeft=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar1=setInterval(Marquee1,Picspeed)
demo.onmouseover=function() {clearInterval(MyMar1)
}
demo.onmouseout=function() {MyMar1=setInterval(Marquee1,Picspeed)
document.getElementById('bimg').innerHTML='';//当鼠标移出是清空图片
}
function show_big(src){
document.getElementById('bimg').innerHTML='img src="'+src+'" width=300 height=400';//在id为bimg的div中显示图片
}
/script
!--最新图文代码结束--