【问题标题】:Linking to a certain position of another page链接到另一个页面的某个位置
【发布时间】:2016-10-05 18:25:37
【问题描述】:

我有一个名为 index.html 的主页,其中有一个链接到该主页上某些位置(部分)的菜单。这是通过菜单中“按钮”后面的变量“数据幻灯片”(见下文)完成的。这在主页上效果很好。但是,当我在另一个 html 页面上而不是主页上时,我该怎么做呢?跳转到主页的某个位置(部分)?

    <div id="nav" class="right">
        <ul class="navigation">
            <li data-slide="1">Home</li>
            <li data-slide="2">Products</li>
            <li data-slide="4">Trade fairs</li>
            <li data-slide="6">Company</li>
            <li data-slide="8">Careers</li>
            <li data-slide="10">Contact</li>
            <li class="clear"></li>
        </ul>
    </div>

Javascript:

var links = $('.navigation').find('li');
slide = $('.slide');
button = $('.button');
mywindow = $(window);
htmlbody = $('html,body');

slide.waypoint(function (event, direction) {

    dataslide = $(this).attr('data-slide');

    if (direction === 'down') {
        $('.navigation li[data-slide="' + dataslide + '"]').addClass('active').prev().removeClass('active');
        $('.navigation li[data-slide="1"]').removeClass('active');
    }
    else {
        $('.navigation li[data-slide="' + dataslide + '"]').addClass('active').next().removeClass('active');
    }
});

mywindow.scroll(function () {
    if (mywindow.scrollTop() == 0) {
        $('.navigation li[data-slide="1"]').addClass('active');
        $('.navigation li[data-slide="2"]').removeClass('active');
    }
});

function goToByScroll(dataslide) {
    var goal = $('.slide[data-slide="' + dataslide + '"]').offset().top;
    if (mywindow.scrollTop()<goal) {
        var goalPx = goal + 1;
    } else {
        var goalPx = goal - 1;
    }
    htmlbody.animate({
        scrollTop: goalPx
    }, 2500, 'easeInOutQuint');
}

links.click(function (e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);
});

button.click(function (e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);

});

【问题讨论】:

标签: javascript jquery html


【解决方案1】:
window.setTimeout(function(){
    if(window.location.hash){
        var $target  = $(window.location.hash).closest("#bgaboutbody");
        if($target.length)
            $('html, body').animate({scrollTop: $target.offset().top}, 1000);
    }
}, 100);

请试试这个链接:-anchor linking to a certain position of the page

【讨论】:

  • 抱歉,您能再解释一下您的提示吗?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-05-03
  • 1970-01-01
  • 1970-01-01
  • 2010-11-18
  • 2013-12-13
  • 2020-09-24
  • 1970-01-01
相关资源
最近更新 更多