使用 javascript onmouseover 使按钮淡出
当我将光标放在图像按钮上时，我想让图像按钮淡出。我正在使用在网上找到的脚本，但它似乎不起作用。
<html>
<head>
<script type="text/javascript">
function FadeOpacity(elemId, fromOpacity, toOpacity, time, fps)
{
var steps = Math.ceil(fps * (time / 1000));
var delta = (toOpacity - fromOpacity) / steps;
FadeOpacityStep(elemId, 0, steps, fromOpacity, delta, (time / steps));
}
function FadeOpacityStep(elemId, stepNum, steps, fromOpacity, delta, timePerStep)
{
SetOpacity(document.getElementById(elemId), Math.round(parseInt(fromOpacity) + (delta * stepNum)));
if (stepNum < steps)
setTimeout("FadeOpacityStep('" + elemId + "', " + (stepNum+1) + ", " + steps + ", " + fromOpacity + ", " + delta + ", " + timePerStep + ");", timePerStep);
}
</script>
</head>
<body>
<form action="opacity.php" method="post">
<input type="image" name="blue" id="ImgAkxl2" value="blue" src="streetfighter.jpg"
onmouseover="UpdateOpacity2()"
/>
</form>
<script language="JavaScript" type="text/javascript">
function UpdateOpacity2()
{
FadeOpacity("ImgAkxl2", 100, 50, 2000, 10);
}
</script>
</body>
</html>
I want to make my image button fade when I put the cursor over it. I am using a script I found online but it doesn't seem to be working.
<html>
<head>
<script type="text/javascript">
function FadeOpacity(elemId, fromOpacity, toOpacity, time, fps)
{
var steps = Math.ceil(fps * (time / 1000));
var delta = (toOpacity - fromOpacity) / steps;
FadeOpacityStep(elemId, 0, steps, fromOpacity, delta, (time / steps));
}
function FadeOpacityStep(elemId, stepNum, steps, fromOpacity, delta, timePerStep)
{
SetOpacity(document.getElementById(elemId), Math.round(parseInt(fromOpacity) + (delta * stepNum)));
if (stepNum < steps)
setTimeout("FadeOpacityStep('" + elemId + "', " + (stepNum+1) + ", " + steps + ", " + fromOpacity + ", " + delta + ", " + timePerStep + ");", timePerStep);
}
</script>
</head>
<body>
<form action="opacity.php" method="post">
<input type="image" name="blue" id="ImgAkxl2" value="blue" src="streetfighter.jpg"
onmouseover="UpdateOpacity2()"
/>
</form>
<script language="JavaScript" type="text/javascript">
function UpdateOpacity2()
{
FadeOpacity("ImgAkxl2", 100, 50, 2000, 10);
}
</script>
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
下面是 SetOpacity 方法的实现代码：
Here is the code with an implementation of the SetOpacity method:
您似乎缺少一个名为 SetOpacity 的函数，请从获取脚本的位置找到该函数并将其添加到您的代码中。这应该可以工作。
It looks like you're missing a function called SetOpacity, find this from where you got the script from and add it to your code. This should then work.
这是一种在 js 中进行淡入或淡出的非常有效的方法，无需使用 jquery，
使用 JavaScript 和淡入淡出CSS
尽管使用 jquery 你编写的代码更少
$(element).fade()。Here is a very efficient way of doing fades in or out in js without using jquery, a
Fade in and fade out with JavaScript & CSS
Although with jquery you write less code
$(element).fade().