gpt4 book ai didi

javascript - 颜色逐渐变化

转载 作者:行者123 更新时间:2023-12-01 02:09:00 25 4
gpt4 key购买 nike

屏幕左上角的标志如何随着鼠标滑过而逐渐改变颜色?我认为它是用 jquery 完成的。如果您不知道代码,您能给我指点可以的教程吗?谢谢。

http://www.shopdev.co.uk/blog/

更新:谢谢大家,我已经发布了下面代码的工作版本,

<html>

<head>

<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">

$(document).ready(function(){

// load the logo transition
$("#logo span").css("opacity","0");
$("#logo span").css("display","block");
// logo animation
$("#logo").hover(function() {
$("#logo span").stop().animate({opacity:1},'slow');
}, function() {
$("#logo span").stop().animate({opacity:0},'slow');
});


});

</script>

<style type="text/css">
#logo span{
background: url(logo2.gif) no-repeat scroll center bottom;
width:257px;
height:75px;
position:absolute;
}
img{
border:0;
}
</style>

</head>

<body>

<div id="logo"><a href="#"><span></span><img src="logo.gif"/></a></div>

</body>

</html>

最佳答案

您是否尝试查看该页面的源代码?这是不透明度的变化。

// load the logo transition
$("#logo span").css("opacity","0");
$("#logo span").css("display","block");
// logo animation
$("#logo").hover(function() {
$("#logo span").stop().animate({opacity:1},'slow');
}, function() {
$("#logo span").stop().animate({opacity:0},'slow');
});

因此,一张图像覆盖在另一张图像上,前面的图像逐渐淡入淡出。不是颜色变化。

请注意代码上方的警告:

// whoah there...  This source code is copyright ShopDev.  By all means, use this website as a source of inspiration - just don't plagiarize! //

关于javascript - 颜色逐渐变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1750380/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com