多重定位,随机大小,绝对定位的元素,使他们不重叠 [英] Positioning multiple, random sized, absolutely positioned elements so they don't overlap

查看:612
本文介绍了多重定位,随机大小,绝对定位的元素,使他们不重叠的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

确定我需要能够定位一堆随机大小的绝对定位词的页面上,但我不希望任何元素重叠。

我们的最终目标是拥有一个流体词云来响应用户交互(记住,球谷歌涂鸦?)。我真的想从头开始构建这个发展我的这种发展的认识。在这个部门的帮助也将是AP preciated:)

The end goal is to have a fluid word cloud that responds to user interaction (remember the Google Balls Doodle?). I would really like to build this from scratch to develop my understanding of this type of development. Any help in this department would also be appreciated :)

推荐答案

我不知道,如果你也想随机放置一个容器内的话,但我已经写了小提琴的做到了这一点。您可以修改code之后对方就一个字的位置,如果你想虽然。我觉得关键部分是检查是否有碰撞的方法。

I'm not sure if you also want to position the words randomly inside a container, but i've written a fiddle that does just that. You can modify the code to position one word right after the other if you want to though. I think the key part is the method to check if there's a collision.

请参见 http://jsfiddle.net/fZtdt/13/

编辑:请注意,这是非常简单,没有优化code。例如,如果你会增加很多的话,很可能是该脚本将不能够满足所有单词的容器内,并进入死循环。

Be aware that this is very simple and unoptimized code. If for example you would add to many words, chances are that the script won't be able to fit all words inside the container, and get into an endless loop.

这篇关于多重定位,随机大小,绝对定位的元素,使他们不重叠的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆