“affix”的相关标签问题_Stack Overflow中文网

0 投票

1 回答

1553 浏览

html - Bootstrap 3 附加标题和菜单

我已搜索但无法获得正确的解决方案

我与以下帖子相差甚远： Bootstrap。如何添加多个添加词缀属性？使用多个词缀属性

请有人帮我解决两个问题：

问题1：

http://jsfiddle.net/Spiral57/b9xTs/

我需要将标题、导航栏和导航包装器固定在顶部，保持黑色背景。

问题 2

http://jsfiddle.net/Spiral57/wnbFf/

我需要将标题、导航栏和导航包装器固定在顶部，保持白色背景。有了这个，我需要徽标保留在右侧。

0 投票

1 回答

372 浏览

twitter-bootstrap-3 - Bootstrap3, affix, fixed-top navbar, toggled text and anchors

I have on my page:

fixed top navbar with height 74px;
affixed sidebar navigation on the right column;
left column, which has toggleable content;

The issues I have are following:

if I click the link with anchor the content on the left column is hidden under fixed-top navbar (this, I will fix probably with margin-top: -74px; padding-top: 74px)
if I collapse the content in the left column then sidebar menu using affix goes creazy. It is still considering collapsed content as visible and therefore the sidebar highlight points to wrong (hidden/collapsed) content.

twitter-bootstrap-3 fixed navbar sidebar affix

0 投票

1 回答

1630 浏览

jquery - 带有全角图像的引导导航栏词缀

我正在尝试使用 Bootstrap Affix 功能将我的导航栏放置在全角响应图像下方。当用户滚动并到达导航栏时，随着用户向下滚动，导航栏将固定在屏幕顶部。下面链接的 JSFiddle 帮助我进行了设置，但顶部偏移量似乎不是动态的。相反，它似乎被设置为英雄图像的原始高度。因此，当我扩大或缩小屏幕尺寸时，词缀不再按预期发挥作用。

JSFiddle在这里：http: //jsfiddle.net/MarkMarine/q3J56/7/

这是我用于 Javascript 以尝试使顶部偏移动态化的代码：

});

jquery twitter-bootstrap responsive-design affix

0 投票

1 回答

445 浏览

javascript - 引导词缀导航栏不检测图像高度

当我添加位于标题元素下方的导航栏元素时，导航栏会过早添加，就好像标题中的图像不存在一样。

导航栏应该在导航栏到达顶部时附加，而不是更早。我用于此的代码将偏移量设置为导航栏的滚动位置，但问题是，这个位置的计算就像标题中的图像不存在一样。

我尝试在图像周围放置 p 标签，将图像高度显式设置为固定高度以及自动，将显示属性设置为每个可能的值，但无济于事。我没有在标题中浮动我的图像。当我在标题中添加额外的文本行时，导航附加到该高度（导航栏附加的偏移高度检测文本的高度，但不检测图像的高度）。

*编辑：小提琴工作正常（这是所需的行为）。 http://jsfiddle.net/gwho/8sAYW/ （由于某种原因，这个小提琴没有表现出有问题的行为）。

咖啡脚本中的 JS

**编辑：但我的本地主机的行为不同，如屏幕截图所示。

我认为问题可能是在rails的资产管道中最后加载图像（在导航栏部分之前）......并且在呈现图像之前计算js代码中导航栏的偏移位置......而在JS小提琴中, 没有这个问题。

如果/我应该如何推迟运行 javascript 代码，以便在加载所有图像后运行？

javascript css twitter-bootstrap affix

0 投票

1 回答

434 浏览

css - 如何在 Bootstrap 3 中创建带有词缀的流畅且响应迅速的水平工具栏？

正如我在标题中所说，我正在尝试在 Bootstrap 中创建一个带有词缀的水平工具栏。我不介意工具栏是否包裹在井、导航或面板中，只要它是水平的并使用词缀即可。

我目前正在使用一口井，我尝试了几个 Bootstrap 组件，结果完全一样。

当我的工具栏未处于“已附加”状态时，它可以正常工作，它具有适当的宽度等等，但是当 affix 启动时，它会失去它的宽度，因为position: fixed. 据我所知，具有固定位置的元素必须提供特定的宽度，这很好，我的问题是我找不到准确可靠的方法来保持工具栏在“固定”之前的宽度，这将设备分辨率不同。

如何为“附加”工具栏提供适当的宽度？如果我不提供宽度，则工具栏太小；如果我提供 100% 的宽度，工具栏会在右侧溢出，并且缺少一些 UI 元素。

这是一个重现我遇到的完全相同问题的示例：http: //www.bootply.com/DAOHegIaTl。

这是用于词缀的 CSS：

css twitter-bootstrap twitter-bootstrap-3 toolbar affix

0 投票

0 回答

112 浏览