在我的示例中,我有一个固定的输入 data-spy =affix,它向下移动 90px 由于父母< div class =containerstyle =margin-top:80px> 。
<所以唯一应该滚动的是文字。这实际上是有效的!我的问题是在输入后面滚动的文本是可见的,我想隐藏它!
我试图在输入前添加一个白色框,但是我所有的尝试都没有真正成功! 所以我希望你能帮助我!谢谢
bootply/113734
解决方案事实上,@ nico-o已经在这里给出了答案。
< div style =background-color:white; padding机顶:80px; data-spy =affixdata-offset-top =1> < input class =form-controlid =searchtermname =tagsplaceholder =Inputtype =text> < / div>这样做,您将遇到与此处所述相同的问题: Bootstrap 3RC1 +侧面板+附加。
为了解决这个问题,请添加:
$(document).scroll (function(){ $('。affix')。width($('。container')。width()); });请参阅: bootply/113811
@ nico-o还提供了一个可滚动的文本容器,参见 getbootstrap/javascript/#scrollspy-examples 为例
In my example i have a fixed input data-spy="affix" that is shifted downwards by 90px because of the parent <div class="container" style="margin-top:80px">.
So the only thing that should scroll is the text. This actually works!
My problem is that the text that is scrolled behind the input is visible and i would like to hide it!
I tried to add a white box before the input but all my tries where not really successful! So i hope you can help me! Thanks
bootply/113734
解决方案in fact @nico-o already gives the answer here. Wrap your input inside a div and apply the affix on this:
<div style="background-color:white;padding-top:80px;" data-spy="affix" data-offset-top="1"> <input class="form-control" id="searchterm" name="tags" placeholder="Input" type="text"> </div>Doing this you will have the same kind of problem as described here: Bootstrap 3RC1 + Side Panel + Affix.
To solve this add:
$(document).scroll(function(){ $('.affix').width($('.container').width()); });See: bootply/113811
@nico-o also suggest a scrollable Text-container, see getbootstrap/javascript/#scrollspy-examples for an example
更多推荐
隐藏在引导后输入后面滚动的文本
发布评论