隐藏 HTML5 Canvas 元素

发布于 2024-12-19 22:59:58 字数 509 浏览 0 评论 0原文

我尝试使用 HTML5 Canvas 标签,直到现在我才成功做到了我想要的。但现在我试图隐藏 Canvas 元素(上下文)。返回的错误是context.fadeOut is not a function

请在此处查看我的草稿:http://jsfiddle.net/t46Ze/4/

感谢您的帮助。


编辑>这是我最初想要的:http://jsfiddle.net/ t46Ze/15/

编辑>这是安德鲁的提议:http://jsfiddle.net/t46Ze/16/(带评论)

I try to use the HTML5 Canvas tag, until now I managed to do what I wanted. But now I'm trying to hide in fade a Canvas element (context). The retunred error is context.fadeOut is not a function.

See my draft here: http://jsfiddle.net/t46Ze/4/

Thanks for your help.


EDIT > Here my initial wanted : http://jsfiddle.net/t46Ze/15/

EDIT > Here the Andrew proposition : http://jsfiddle.net/t46Ze/16/ (with comments)

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

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

发布评论

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

评论(5

巴黎夜雨 2024-12-26 22:59:58

您正在尝试淡出画布的 2D 上下文,而不是画布元素本身。相反,淡出元素本身。

You're trying to fade out the 2D context of the canvas, not the canvas element itself. Fade out the element itself instead.

夏了南城 2024-12-26 22:59:58

使用 $(canvas).fadeOut 而不是 context.fadeOut

Do $(canvas).fadeOut instead of context.fadeOut

╰ゝ天使的微笑 2024-12-26 22:59:58

您可以完全按照您所做的操作来绘制它,但相反,

http://jsfiddle.net/t46Ze/ 15/

You can just do exactly what you do to draw it, but in reverse,

http://jsfiddle.net/t46Ze/15/

愁以何悠 2024-12-26 22:59:58

您可能想尝试使用 jQuery。

<html>
<head>
    <!-- Path to your jQuery core js library or you can use one from Google.
    <script type="text/javascript" src="jquery.min.js" />
    <!-- Path to your jQuery UI js library or you can use one from Google.
    <script type="text/javascript" src="jquery-ui.min.js" />

</head>
<body>
   <canvas id="myCanvas" ..>..</canvas>
</body>
</html>

当你想淡出它时,只需调用:

$("#myCanvas").fadeOut(2500); // 2 seconds and a half, for example

还有其他“效果”,例如:

$("#myCanvas").slideUp(1500); // 1 and a half seconds, for example

You may want to try it with jQuery.

<html>
<head>
    <!-- Path to your jQuery core js library or you can use one from Google.
    <script type="text/javascript" src="jquery.min.js" />
    <!-- Path to your jQuery UI js library or you can use one from Google.
    <script type="text/javascript" src="jquery-ui.min.js" />

</head>
<body>
   <canvas id="myCanvas" ..>..</canvas>
</body>
</html>

And when you want to fade it out, just call:

$("#myCanvas").fadeOut(2500); // 2 seconds and a half, for example

There are also other "effects" like:

$("#myCanvas").slideUp(1500); // 1 and a half seconds, for example
人海汹涌 2024-12-26 22:59:58

我在画布中尝试了以下代码

<canvas id="newCanvas" style="display: none"></canvas>

I tried the below code in the canvas

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