如何使雨水堆积在文本上,并浇在网页上

时间:2015-02-08 10:45:52

标签: javascript html css

如何让雨水流过"我的文字"?我有这个代码,你可以在我的JSFiddle中看到:

function strop(cleft, ctop, d) {
    var drop = document.createElement('div');
    drop.className = 'punct';
    drop.style.left = cleft + 'px';
    drop.style.top = ctop + 'px';
    drop.id = d;
    document.getElementById('content').appendChild(drop);
}

http://jsfiddle.net/35h2Q/23/

点击底部的开始按钮后开始下雨。

我正在努力制造下雨效果,突然之间想到的是“为什么不让雨水流倾盆而出?”#34;。但是我已经尝试了所有措施让雨堆流过文字,但我没有成功。

我做了一些研究,可能有一些物理定律使它成为可能。我有什么想法可以做到这一点?你有什么进一步的建议来改进动画吗?谢谢你。

1 个答案:

答案 0 :(得分:1)

在雨滴css规则

上设置z-index: 1

修改过的小提琴:http://jsfiddle.net/35h2Q/22/