【问题标题】:trying to avoid horizontal scrolling using jquery/masonry尝试使用 jquery/masonry 避免水平滚动
【发布时间】:2012-09-20 18:29:38
【问题描述】:

这是我在这里的第一篇文章:)

我对网络开发非常陌生,实际上,就在几天前,当我决定开始为我的乐队建立一个新网站时,我真的什么都不知道。因此,如果代码不是最好的,请不要怪我,现在我希望网站看起来不错并且适用于任何屏幕分辨率(=> 1920x1080 和智能手机)到目前为止,我已经能够实现一切我想要,但现在我在尝试了一整天后被卡住了:

请看一下这个网站http://www.unstucc.de/test/band_site_for_stackoverflow.html(这是我目前所取得的成就的快照)

如果您禁用 javasript 并水平调整浏览器大小,您会看到每个乐队成员的那些“框”移动,因此它们始终完全可见。你永远不必水平滚动,除非你的屏幕真的很小。如果您水平放大浏览器并且右侧有足够的空间放置另一个“框”,则下一个“框”会向上跳一行。我喜欢这种行为,我想保留它。 但是砌体破坏了这种行为,你可以看到如果你启用了javascript。要查看位于右侧的乐队成员,您必须水平滚动到右侧。 我怎样才能配置砌体以尊重这种预期的行为,但仍然在定位“盒子”方面发挥它的魔力?我想让砖石把它们放在正确的位置,因为它看起来好多了,因为“盒子”的高度不同。

我希望我的描述足够清楚,英语不是我的母语。

【问题讨论】:

  • 而且 - 答案成功了吗?

标签: jquery jquery-masonry


【解决方案1】:

你的绝对定位

<div id="left">

推动整个 Masonry 容器

<div id="band_right">

在屏幕右侧,因此需要滚动。如果您总是希望“CD 封面/社交网络图标”元素出现在左上方,请使用简单的 Masonry 左角图章技巧:将该元素设为您的第一个 .masonry-brick,然后摆脱这些

left: 420px;

在您的 Masonry 容器 CSS 上,它会起作用。只需禁用 left: 420px;在 Chrome 的 devtools 中,你会明白我的意思。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-11-05
    • 1970-01-01
    • 1970-01-01
    • 2012-03-15
    • 1970-01-01
    • 2011-09-17
    • 2020-08-11
    • 1970-01-01
    相关资源
    最近更新 更多