Javascript 文本动画:越来越大,然后消失

发布于 2024-10-07 18:14:53 字数 420 浏览 3 评论 0原文

我需要某种可以执行以下操作的 JavaScript:

我需要一些小的绿色文本。然后该文本应该变得越来越大,然后以某种方式消失。这总共大约需要 2-3 秒。我需要在网站的不同位置放置这些文本,这意味着它具有以下要求:

  • 这些文本应该只是视觉的。它 不应干扰用户的操作 可以点击等等

  • JavaScript 不应该很 对于用户来说加载/使用很重,因为 网站已经很重了

  • 应该可以在 ASP.NET 中实现

我知道这很难描述。我能给出的最好的想法是魔兽世界/其他游戏。每次你射击时,你都会得到一些小数字来描述你击中了多少。这是相同的想法:您在网站上执行一些操作,然后通过该文本动画以图形方式通知用户......

您如何解决这个问题?

事先非常感谢...

I need some kind of JavaScript which can do the following:

I need some small green text. This text should then grow larger and larger and then disappear in some way. This should take around 2-3 seconds in total. I will need several of these texts different places on the website, which means it has the following requirements:

  • These texts should only be visual. It
    should not interfere with what a user
    can click upon and such

  • The JavaScript shouldn't be very
    heavy to load/use for the user, as
    the website already is quite heavy

  • Should be implementable in ASP.NET

I do know this is quite hard to describe. The best idea I can give is World of Warcraft / other games. Each time you shoot, you get some small number describing how much you hit. This is the same idea: You do some action on the website, and then the user is informed by this text animation graphically...

How do you come around this?

Thanks so much on beforehand...

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

幻梦 2024-10-14 18:14:53

使用 jQuery.animate 可以轻松实现这一点:

http://api.jquery.com/animate/

您可以尝试这样的操作,在 5000 毫秒的时间内将不透明度从 100% 更改为 0%,将 fontSize 从当前更改为 5em:

$('.someDiv').animate({opacity:0,fontSize:'5em' }, 5000);

工作示例在这里: http://jsfiddle.net/Gfca4/

This is easy to achieve with jQuery.animate:

http://api.jquery.com/animate/

You can try something like this, which changes the opacity from 100% to 0% and fontSize from current to 5em over the course of 5000 ms:

$('.someDiv').animate({opacity:0,fontSize:'5em'}, 5000);

Working example is here: http://jsfiddle.net/Gfca4/

何以畏孤独 2024-10-14 18:14:53

如果你能找到的话,Walter Zorn JS Graphics 有一个 JavaScript 图形引擎,它通过使用 1x1 div 创建单个像素来工作。它能够绘制线条、形状和文本。该网站有一个双缓冲动画示例,通过隐藏您正在绘制的 div,然后与可见的交换来提高性能。

Walter Zorn 的网站已关闭

If you can find it Walter Zorn JS Graphics had a javascript graphics engine that worked by creating single pixels using 1x1 divs. It is able to draw lines, shapes, and text. The site had a double buffer animation example by hiding the div you're drawing in then swap with the visible improves performance.

Walter Zorn's website is down

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文