jQuery 填充玻璃效果
我正在寻找一个 jQuery 或 javascript 来装满一杯水。因此，当单击一个按钮时，您会向玻璃杯中添加水，而当单击另一个按钮时，您会从玻璃杯中除去水。只是想知道是否有人已经写过类似的东西供我使用。
谢谢！
I'm looking for a jQuery or javascript that fill up a glass of water. So when clicking on one button you add water to the glass and when clicking on another you remove water from the glass. Just wonder if someone already have written something like this that I can use.
Thanks!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
创建水杯的图片，玻璃部分透明。
在其后面放一张水的图片。
从下到上对图像进行动画处理。如果您希望水填充时呈现“波浪状”，请使图像具有波纹状顶部，使其比玻璃稍大，并从一侧到另一侧稍微制作动画。
Create a picture of a water glass with the glass portion transparent.
Put a picture of water behind it.
Animate the image from the bottom to the top. If you want "wavy" water as it fills, make the image have a rippled top, make it slightly larger than the glass, and animate from side to side a little as well.
您可能想研究一下 jQuery 中的向下滑动和向上滑动效果。你应该能够从他们那里得到你想要的东西。
链接
You may want to look into the slide down and slideup effects in jQuery. You should be able to get what you want out of them.
Link
要创建逼真的水效果，请使用 A 类浏览器中的 canvas 元素。
更好的是，探索 john 'jquery' resig 的processing.js 库。我想用这个做你想做的事情应该不难。
首先，
http://processingjs.org/
processing.js 的一些示例
http://hyper-metrix.com/processing-js/docs/?page=A %20mouse-driven%20graphic%20equalizer
http ://www.mattryall.net/blog/2008/11/wiki-visualizations-with-javascript#
To create realistic water effects, use the canvas element in A class browsers.
Better, explore john 'jquery' resig's processing.js library. I guess it shouldnt be tough to do what you want with this.
To start you off,
http://processingjs.org/
some examples of processing.js
http://hyper-metrix.com/processing-js/docs/?page=A%20mouse-driven%20graphic%20equalizer
http://www.mattryall.net/blog/2008/11/wiki-visualisations-with-javascript#