cor*_*ore -2 javascript jquery jquery-animate
我使用以下代码片段制作元素的背景浅蓝色,然后在30秒内慢慢淡化为白色:
$("#" + post.Id).css("background-color", "lightblue")
.animate({ backgroundColor: "white" }, 30000);
Run Code Online (Sandbox Code Playgroud)
两个问题.
首先,有没有办法将不透明度淡化到100%?这样,如果我选择更改页面的背景颜色,我不必更改"白色"?
其次,大约每10或15次一次,背景保持浅蓝色并且不会褪色为白色.我正在使用最新版本的jQuery和UI核心.怎么可能出错?
编辑:赏金是解决第二个问题的问题.
显然我被遗忘了,因为我说我推出了自己的解决方案,但没有显示出来.我的错.我不想自我推销.我的代码100%的工作时间,不需要jQuery.演示和代码可以在以下位置找到:
http://prettycode.org/2009/07/30/fade-background-color-in-javascript/
Kip*_*Kip 14
对于你的第二个问题:根据我的经验,这通常是因为页面上的其他地方发生了Javascript错误.一旦有一个Javascript异常,页面的其余部分就会停止运行Javascript.尝试安装Firebug(如果您还没有),然后打开"控制台"选项卡并启用它.然后,任何javascript错误或异常都将打印到控制台.
尝试的另一件事(这与我上次的陈述相矛盾......)是禁用所有浏览器插件以查看是否可以重新创建.有时它们会干扰页面上的脚本(尤其是GreaseMonkey).
如果您可以提供再现此动画问题的示例HTML代码段,那么我们将更容易为您提供帮助. 在我下面粘贴的脚本中,我可以整天点击它,尽可能快或慢,并且它永远不会为我动画.
对于第一个问题:我知道你说你找到了一个解决方法,但以下工作对我来说(即使在IE6上)所以我想我会发布它,因为它可能与你的想法有所不同.(请注意,通过jQuery.css()IE上的工作设置CSS"opacity"属性,而IE不直接在CSS中支持"opacity"属性.)
<html>
<head>
<style>
body { background-color: #08f; }
#test { background-color: white; width: 100px; }
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>
var myOpacity = 0.125;
$(function(){
$('#test').css('opacity', myOpacity);
$('a').click(function(){
myOpacity = 1.0 - myOpacity;
$('#test').animate({ opacity: myOpacity });
return false;
});
});
</script>
</head>
<body>
<p><a href="#">Click me</a></p>
<div id="test">Test</div>
</body></html>
Run Code Online (Sandbox Code Playgroud)
别忘了颜色插件.
看到这里
当颜色无法激活为蓝色时,您可以尝试使用回调函数将消息记录到控制台.然后,您可以检查事件是否实际触发并完成.如果确实如此,那么您可能会使用两个动画.第一个动画到中途房屋颜色然后使用回调动画为白色(所以你得到两个樱桃咬,如果外部失败但完成回调有第二个去)
如果您可以尝试重新创建问题或提供问题的URL,那将是一件好事.
例如
$("#" + post.Id).css("background-color", "lightblue")
.animate({ backgroundColor: "#C0D9D9" }, 15000, function(){
$(this).animate({ backgroundColor: "#ffffff" }, 15000)
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1365 次 |
| 最近记录: |