1

通过 localscroll 和 scrollto,我构建了一个水平滑动页面(Environment),还将哈希添加到 url。示例:当从 localScroll 单击导航中的链接时,它会在 url (index.html#media) 中添加哈希。

现在通过 Localscroll 没有活动链接支持,我想添加它并在这里找到了一些解决方案:Stackoverflow

我很高兴,但后来我尝试重新加载页面,当用户在媒体部分时,例如在媒体部分,不支持识别 url,并且它不会将选定的类添加到当前选择的导航链接中网址。

所以我做了更多的研究,发现了那个网站:网站

很棒,但它不适用于我的水平设置。我几乎没有开始了解javascript,我什至根本不知道如何jquery,所以我用我的逻辑修改了脚本并且到目前为止:

我添加了类,即使当我通过鼠标滚轮滚动时,它也很好地将类添加到所有导航链接。但是:它不会删除它们。

<script style="text/javascript">
    $(function(){
        var sections = {},
            _width   = $(window).width(),
            i        = 0;

        // Grab positions of our sections 
        $('.section').each(function(){
            sections[this.name] = $(this).offset().left;
        });

        $(document).scroll(function(){
            var $this = $(this),
                pos   = $this.scrollLeft();

            for(i in sections){
                if(sections[i] > pos && sections[i] < pos + _width){
                    $('#nav ul li a').removeClass('selected');
                    $('#nav_' + i).addClass('selected');
                }  
            }
        });
    });

    $(".scroll").click(function(event){
        event.preventDefault();
        var full_url = this.href;
        var parts = full_url.split("#");
        var trgt = parts[1];
        var target_offset = $("#"+trgt).offset();
        var target_top = target_offset.left;
        $('html, body').animate({scrollLeft:target_top}, 800);
    });
</script>

如何更新链接以删除选定的类?

编辑:我认为我很接近我认为它需要更改 for 标头

if(sections[i] > pos && sections[i] < pos + _width)

将“选定”类分配给当前查看的幻灯片需要进行哪些更改

4

0 回答 0