Bootstrap Sidebar Scrolling，Affix& Scrollspy [英] Bootstrap Sidebar Scrolling, Affix & Scrollspy

问题描述

NEWER

所以滚动功能现在正在工作...但它固定在页面顶部。我需要它在正确的位置（旁边的内容），然后开始滚动与它的内容的当前位置。

我试图让我的侧边栏滚动到这里 - > http://getbootstrap.com/2.3.2/components.html

该网站是 http://www.katyasarmiento.zzl.org

b

我有一个很难的时间。我查了一切，我可以，我仍然不能弄清楚。我得到它工作了一段时间与我发现的教程，但它不能很好地与ScrollSpy。所以我试图使用Bootstrap的粘贴。

我刚开始使用javascript / jquery，所以如果任何人都可以查看我的网站，并检查我做错了什么。

ScrollSpy现在正在工作，我想我不能得到侧边栏与页面滚动。

解决方案<

我做的是改变以下...

 < div class =bs-docs-sidebar span3> 
< ul class =nav nav-list bs-docs-sidenav affix-top> 
  

To ...

 < div class =bs-docs-sidebar span3> 
< ul class =nav nav-list bs-docs-sidenav affixdata-spy =affixdata-offset-top =255data-offset-bottom =200 
  

所以我把data-spy和data-offset放在bs-docs-sidenav ，将脚本改为该类，而不是bs-docs-sidebar类。

然后我编辑了affix-top，affix和affix-bottom，它的工作原理很好：）

我的原始问题是指侧边栏类，而不是sidenav类，因为这是我的affix CSS

希望这可以帮助任何遇到类似问题的人：）

我这是这些 教学。

NEWER

So the scrolling is working now... But it's fixed to the top of the page. I need it to be in the correct position (next to the content) and then start scrolling with at it's current position with the content.

I'm trying to get my sidebar to scroll like this one here -> http://getbootstrap.com/2.3.2/components.html

The website is http://www.katyasarmiento.zzl.org (a free hosted site for now)

---

OLDER

I'm having a really hard time with this. I've looked up everything I could and I still can't figure it out. I got it to work for a while with a tutorial I found, but it didn't work well with ScrollSpy. So I'm trying to use Bootstrap's Affix.

I'm new to javascript / jquery so if anyone could look over my website and check to see what I'm doing wrong.

The ScrollSpy is working right now I think, I just can't get the sidebar to scroll with the page.

解决方案

ALRIGHT I got it to work!

What I did was change the following...

<div class="bs-docs-sidebar span3">
    <ul class="nav nav-list bs-docs-sidenav affix-top">

To...

<div class="bs-docs-sidebar span3">
    <ul class="nav nav-list bs-docs-sidenav affix" data-spy="affix" data-offset-top="255" data-offset-bottom="200">

So I put the data-spy and data-offset on the "bs-docs-sidenav" class, changed the script to that class also instead of the "bs-docs-sidebar" class.

Then I edited the css of "affix-top", "affix", and "affix-bottom" and it works very well :)

My original problem was referring to the sidebar class instead of the sidenav class, because that's what my affix CSS was working on.

Hope this helps anyone that was having a similar issue to mine :)

What helped me with this were these tutorials.

这篇关于Bootstrap Sidebar Scrolling，Affix&amp; Scrollspy的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！