当我的网页加载时,我希望有链接。单击所有链接后,我希望图像在页面底部淡入(图像显示“完成”,这基本上意味着用户已完成单击所有链接)。我首先在网页加载时隐藏图像,就像这样;
<html>
<body>
<!-- links which need to be clicked go here -->
<img id='complete' src='../images/complete.png' alt='' />
</body>
</html>
<style>
#complete {
visibility: hidden;
}
</style>
<script>
// once all links are clicked
$('#complete').fadeIn();
</script>
使用这段代码,#complete 不会淡入(可能是因为可见性设置为隐藏)。我尝试在淡入命令之前将可见性设置为可见,但仍然没有使它淡入。我还尝试制作 css
#complete {
filter: alpha(opacity = 0);
}
和脚本
$('#complete').fadeTo('slow', '100');
那是行不通的,#complete 只是出现得非常快,而不是慢慢消失。 我正在使用 IE8 和 CSS,知道如何解决这个问题吗?
最佳答案
在 CSS 上
#complete {
display: none;
}
在 javascript 上
$('#complete').fadeIn();
并尝试使用最新的 jquery
<body>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
</body>
查看实际效果:http://jsfiddle.net/KUqJL/你的问题就是我说的关于 css 的问题
关于Javascript/CSS - 在没有出现的图像中淡入淡出?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21027435/