Question

我正在尝试实现定位点以滚动到我的Jack-Scrolling主页上的某些“视图”。我使用了CodePen或以下显示的方法。但是，由于这种方法，<a name="xyz"></a>引用时代码中的任何www.domain.com#xyz标记只显示我网站的第一个“页面”。我如何解决这个问题，或者使用其他标记方法产生可比较的结果？

<div id="projects">
    <section id="project-0" class="slide active"> Test 1</section>
    <section id="project-1" class="slide active"> testing 2</section>
    <section id="project-2" class="slide active"> This is testing 3</section>
</div>

JS：

var delta = 0;
var currentSlideIndex = 0;
var scrollThreshold = 30;
var slides = $(".slide");
var numSlides = slides.length;
function elementScroll (e) {
  console.log (Math.abs(delta));
    // --- Scrolling up ---
    if (e.originalEvent.detail < 0 || e.originalEvent.wheelDelta > 0) { 
        delta--;
        if ( Math.abs(delta) >= scrollThreshold) {
        prevSlide();
        }
    }

    // --- Scrolling down ---
    else {
        delta++;
        if (delta >= scrollThreshold) {
            nextSlide();
        }
    }

    // Prevent page from scrolling
    return false;
}


function showSlide() {
    delta = 0; // reset
    slides.each(function(i, slide) {
        $(slide).toggleClass('active', (i >= currentSlideIndex));
    });
}

function prevSlide() {
    currentSlideIndex--;
    if (currentSlideIndex < 0) {
        currentSlideIndex = 0;
    }
    showSlide();
}

function nextSlide() {
    currentSlideIndex++;

    if (currentSlideIndex > numSlides) { 
        currentSlideIndex = numSlides;
    }
    showSlide();
}

$(window).on({
    'DOMMouseScroll mousewheel': elementScroll
});

非常感谢，只是为了帮助您阅读代码，方法是将每个幻灯片放在彼此的顶部，然后只显示由滚动索引定义的那个（如果是，则递增和递减）滚动大于我们的滚动阈值）。 - 可能是使用JQuery的东西？谢谢你的帮助。

叠加千斤顶滚动方式中的锚标签

0 个答案: