Question

当点击特定链接时，我有一个具有特定类名的div我想跳转到div。我怎样才能做到这一点？

HTML

<a class="my_link" href="#"> This is my link </a>

<div class="Home"> This is my target </div>

由于

Answer 1

你可以用ids

来做到这一点

<a class="my_link" href="#Home"> This is my link </a>

<div id="Home"> This is my target </div>

如果您需要留下课程：

<div class="Home" id="someId"> This is my target </div>

只需将链接中的#Home替换为#someId

即可

只需链接到您的网页，然后将＃放在链接后面它适用于ID，因为每页应该是唯一的

完整示例：

<a class="my_link" href="some-of-your-pages#Home"> This is my link </a>

Answer 2

你可以用这个

<a class="my_link" href="#Home"> This is my link </a>

<div class="Home" id="Home"> This is my target </div>

Answer 3

$(".my_link").click(function() {
    $('html,body').animate({
        scrollTop: $(".Home").offset().top},
        'slow');
});

.first {
    width: 100%;
    height: 1000px;
    background: #ccc;
}

.Home {
    width: 100%;
    height: 1000px;
    background: #999;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="first"><a class="my_link" href="#"> This is my link </a>
</div>
<div class="Home"> This is my target </div>

请检查我上面的代码段吗？

Answer 4

尝试类似这样的东西，它使用jQuery，作为额外的奖励它有平滑的滚动

$(document).ready(function () {
    $("a#smooth_scroll").on('click', function(event) {
        var el = $(this)
        var href = el.attr('href') // can be an id or a class

        var nav_element_height =  $(".navbar").outerHeight();
        var target = $(href);
        var target_offset = target.offset().top;

        var offset = Math.round(target_offset - nav_element_height);

        if (target.length) {
            event.preventDefault();
            $('html, body').stop().animate({
                scrollTop: offset
            }, 1000);
        }
    });
})

但正如其他人所建议的那样，我建议为此目的使用ID

Answer 5

另一种方法是使用jQuery，在这种情况下你可以只使用类。如果你想要一个更好的效果，如平滑滚动，这将是很方便的，但你应该每页只实现一次。

$(".origin").click(function () {
    $('html,body').animate({
        scrollTop: $(".destination").offset().top
    }, 'slow');
})

只需为链接提供原始类，以及要滚动到目标类的div。然后这些可以在网站的不同部分重复（不在同一页面上）。

Answer 6

在event.setView( view="main/index", cache=true )上方为name代码提供anchor属性，并在链接div

中提及该名称

href

＆＃13;

<a class="my_link" href="#home"> This is my link </a>


<a name="home"></a>
<div class="Home"> This is my target </div>

＆＃13;

我附上了一些内容，因此您可以查看演示

如何在同一页面中链接一个类

6 个答案: