Javascript 我有一个h1标题在我的旋转木马项目，我想固定的位置，滚动标题

我有一个旋转木马，其中包含一个标题

议程日期标题

。我想让标题固定在滚动上。现在还没修好。类

fixed position

中css的

top

属性仅更改其在滚动上的位置，而不是实际修复它。关于如何获得我计划在这里得到的东西，有什么建议吗

<div class="container-fluid clearfix" style="padding-left:0; padding-right:0;">
    <div id="left-side" class="agenda-container">
        <div id="agenda-date-container" class="carousel slide" data-ride="carousel" data-interval="false">
            <div class="carousel-inner" role="listbox">
                <div class="carousel-item active agenda-date" id="dec12">
                    <h1 class="text-center agenda-date-heading">December 12</h1>
                </div>
                <div class="carousel-item agenda-date" id="dec13">
                    <h1 class="text-center agenda-date-heading">December 13</h1>
                </div>
                <a class="carousel-control-prev" href="#agenda-date-container" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">Previous</span>
                </a>
                <a class="carousel-control-next" href="#agenda-date-container" role="button" data-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="sr-only">Next</span>
                </a>
            </div>
        </div>
    </div>
</div>

这是我的jquery

var dateOffsetY = $('#agenda-date-container').offset().top;

function dateOffsetScroll(){
    if($(window).scrollTop()>=dateOffsetY) {
        $('.agenda-date-heading').addClass("fixed-position");
    }else {
        $('.agenda-date-heading').removeClass("fixed-position");
    }
}

document.onscroll = dateOffsetScroll;

---

您的描述不清楚您是要修复页面滚动上的标题，还是要修复旋转木马滚动上的标题（表示移动到下一张幻灯片时）？如果您提供任何Fiddle，这将有所帮助。我希望它固定在页面滚动上。您的描述不清楚您是要固定页面滚动上的标题，还是要固定旋转木马滚动上的标题（表示移动到下一张幻灯片时）？如果您提供任何小提琴，它将有帮助。我希望它固定在页面滚动上

var dateOffsetY = $('#agenda-date-container').offset().top;

function dateOffsetScroll(){
    if($(window).scrollTop()>=dateOffsetY) {
        $('.agenda-date-heading').addClass("fixed-position");
    }else {
        $('.agenda-date-heading').removeClass("fixed-position");
    }
}

document.onscroll = dateOffsetScroll;