网页制作17-Javascipt图像特效の鼠标经过图像震动

01、效果图

02、grammer用法

parseInt() 函数可解析一个字符串,并返回一个整数。

parseInt(string, radix)

  • 如果 string 以 "0x" 开头,parseInt() 会把 string 的其余部分解析为十六进制的整数。
  • 如果 string 以 0 开头,那么 ECMAScript v3 允许 parseInt() 的一个实现把其后的字符解析为八进制或十六进制的数字。
  • 如果 string 以 1 ~ 9 的数字开头,parseInt() 将把它解析为十进制的整数。

03代码


<html><head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
.zhendimage{
position:relative
}
</style>
<script>
var rector=3
var stopit=0 
var a=1

function init(which){
stopit=0
zhend=which
zhend.style.left=0
zhend.style.top=0
}//鼠标经过,初始化图像位置

function rattleimage(){
if (stopit==1)
return
if (a==1){
zhend.style.top=parseInt(zhend.style.top)+rector
}
else if (a==2){
zhend.style.left=parseInt(zhend.style.left)+rector
}
else if (a==3){
zhend.style.top=parseInt(zhend.style.top)-rector
}
else{
zhend.style.left=parseInt(zhend.style.left)-rector
}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",50)
}

function stoprattle(which){
stopit=1
which.style.left=0
which.style.top=0
}//移开鼠标归正图像
</script>
</head>
<body>   
<img class="zhendimage" onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this)" height="200"
                  src="ABC.png" alt="">
</body></html>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值