Question

我当前正在使用此jqFloat.js来使元素漂浮在页面周围的空间中。
不幸的是，它们相对于屏幕尺寸浮动，而不是相对于其父容器的浮动，这是我希望实现的。

这是我结构的HTML

<div class="wrapper">
<div id="projects">
  <div>
  <a href="projects/first/index.html" class="project-item">
    <img src="images/body/brain.png" id="image" class="brain" />
        <div class="title">Sintesi addittiva</div>
  </a>
  </div>
  <div>
  <a href="projects/first/index.html" class="project-item">
    <img src="images/body/eyes.png" id="image" class="eyes" />
        <div class="title">Menschen Messe</div>
  </a>
  </div>
</div>

通过CSS将.wrapper的类设置为height: 100%; width: 85%;，而.project-item是我的浮动项的类。

This is the source of jqFloat

此刻，我的项目正确浮动，并且每次页面加载时都处于随机位置，但有时它们从包装器（以及屏幕）中脱出。

我尝试将.projects-item（触发浮动效果的类）分配给父div，但随后这些项消失了。

我想我基本上要实现的是定义一个空间，应在其中运行jqFloat的代码，并且如果其中一项触摸包装器的边缘之一，则该项必须“反弹”

目前这是网站，其设计非常粗糙。这些项目（身体部位）必须停留在绿线内，即.wrapper。

Website

非常感谢您的帮助

jqFloat.js-将浮动对象保留在容器内

0 个答案: