Tag: 动画

幻灯片动画在Firefox中运行良好但在chrome中断断续续: 我正在建立一个网站，当你点击另一个位于页面左侧，顶部或右侧的div的按钮时，如果将中心div推出屏幕。左，上和右div将使用jquery ajax加载，并使用css3进行动画处理。这是我正在谈论的页面： http://www.uvm.edu/~areid/homesite/index.html 尝试在Chrome和Firefox中单击左眼。你会看到Firefox中的动画很流畅但是在chrome中断断续续。有谁知道为什么会发生这种情况？我也想知道是否有人知道我如何可能加速网站/使过渡看起来更顺畅。感谢你们的帮助最好，凯蒂

jQuery动画背景颜色不动画: http://jsfiddle.net/leonwho/98mD2/ HTML 1 Sync! CSS #account-setup-guide { position: relative; margin: 30px 30px 20px 20px; padding: 20px; width: auto; border: 5px solid orange; background: orange; } jQuery的 var animateThis = function() { console.log(‘run animateThis’); $(‘#account-setup-guide’).stop().animate({backgroundColor: ‘#ffffff’}, 500); $(‘#account-setup-guide’).animate({ background: ‘white’ }, 500); } animateThis(); 不知道为什么这不起作用，我已经使用了.animate上面的两个例子但是它在我当前的jsfiddle测试中不起作用:(

加载GIF会在Safari中提交表单时停止动画: 看看这个简单的JSFiddle （忽略所有的javascript代码，这里的问题只是关于动画加载GIF）。我希望在提交表单之前显示动画加载GIF。我试过这个： setTimeout(function(){ $(‘form[name=”checkout-form”]’).submit(); },1000); 这样工作正常，动画加载GIF出现1秒钟，然而，一旦发送提交请求，它就会停止动画。我需要做什么才能让GIF动画直到页面再次加载（或直到响应从页面返回？）

jQuery：div在动画后弹回到完整大小: 在下面的jQuery示例中，我在另一个内部有一个div。当我将内部div设置为宽度为0时，外部div（具有绝对定位）的宽度随之减小。这是期望的。问题是在动画完成后，外部div会弹回原始大小。这是预期的吗？我该如何防止这种情况发生？谢谢！例 HTML： innerContent CSS： div.outer { position: absolute; padding: 10px; background: purple; } div.inner { position: relative; padding-left: 5px; padding-right: 5px; background: orange; clip: auto; overflow: hidden; } JavaScript的： $(‘.outer’).click(function() { $(‘.inner’).animate({width: 0, paddingLeft: 0, paddingRight: 0}, ‘slow’); });

如何使div或对象逐渐移动到使用javascript点击鼠标点？: 所以我有一个10×10像素的正方形或div。我希望能够在浏览器窗口中的某个位置单击，使div逐渐向我单击的点移动。

如何在html5canvas中逐步绘制线条动画: 我正在使用canvas。我画了一套线。这是我的示例代码 for(var i = 0 ; i< points.length; i++){ var point = points[i]; setInterval(function() { ctx.strokeStyle = "black"; ctx.moveTo(point.startX, point.startY); ctx.lineTo(point.startX1, point.startY1); ctx.stroke(); }, 500); } 此代码每0.5秒后绘制一行。但我希望逐步制作动画。所以请帮助逐步划清界限。此屏幕截图显示输出。我在SVG中做到了这一点。但我在canvas上需要相同的东西。

jQuery如果鼠标结束2秒钟。开始动画或根本不动画: 情况就是这样：我有一个产品清单，连续4个产品。当您hover其中一个产品时，会显示工具提示。我担心的是，如果你从左到右快速移动鼠标或者在产品上移动任何东西，你会得到所有显示的工具提示几秒钟。我想知道如果鼠标在产品上停留2秒钟，我是否可以对jQuery说启动动画。因此，如果您将鼠标放在产品上1秒钟。然后鼠标移出，动画根本不会启动。我正在使用jQuery 1.2.6，这是我的工具提示代码： $(document).ready(function(){ $(‘.thumb-image’).hover(function() { $(“.thumb-image”).mousemove(function(e){ $(this).find(“.t-desc”).filter(“:not(:animated)”).fadeIn(500); $(this).find(“.t-desc”).css({ top: (e.pageY + 27) + “px”, left: (e.pageX – 20) + “px” }); }); }, function() { $(this).find(“.t-desc”, this).fadeOut(250); }); });

如何使用jQuery为属性值（而不是样式属性）设置动画？: 我需要为iframe的height属性设置动画，但似乎animate函数仅接受样式属性。有什么想法吗？

在jquery中创建循环背景动画: 我想要的是：当页面加载时 – 背景在10秒后变为红色，bgColor变为绿色，淡出淡出动画…再过10秒后变为橙色……然后再变为红色等等。能有人帮忙吗

在jquery中编写全局动画队列: 使用jQuery将一系列动画添加到单个dom元素非常简单。 jQuery很好地为我排队，我基本上不需要做任何事情。然而，在一些元素上制作一系列动画（例如pictureDiv淡出，然后demographicsDiv淡入）要困难得多。我写了一个插件类型的东西，使其更容易，如下所示： var something.createAnimationQueue = function () { // jQuery queues up animations on each dom element (/ jquery object) // We want to queue up animations over different dom elements so // use a jquery object on a blank element var animationQueue = $({}); return { add: function (animationFunctionContext, animationFunction) { var […]