Question

我正在将我的网站更新为这样的内容：axelboberg.se/en/beta_web在联系人向下滑动中我还想要一个关于我的div。（当我点击关于我时，“向下滑动div”将向下滑动并显示关于我的部分。当我点击联系人时，将显示联系部分...）我该如何做到这一点？在编码时我是初学者，希望这可以通过一行简单的代码来解决......

- Update-- 谢谢，但我的意思是从顶部进入的div内部，只显示或联系当时......就像minimalmokey那样... http://minimalmonkey.com

我想要“slidenav”div中的两个并行div。发布的代码太多，请参阅网站的源代码..

Answer 1

当我点击关于我时，“向下滑动div”将向下滑动并显示关于我的部分。当我点击联系人时，将显示联系人部分......）我怎样才能做到这一点，而且我是编码的初学者，希望这可以通过一行简单的代码解决......

实际上，这可以通过一行简单的代码完成！

将您的“关于我”链接更改为：

<a href="#AboutMe">About Me</a>

然后，像这样创建一个div：

<div id="AboutMe">This is about me!</div>

点击该链接后，您的浏览器将滚动到AboutMe div。

JsFiddle：http://jsfiddle.net/NmrbP/11/

Answer 2

我认为你正在引用平滑的滚动效果。使用jQuery，这是我的示例代码

DEMO http://jsfiddle.net/kevinPHPkevin/NmrbP/13/

$(document).ready(function(){
    $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();

        var target = this.hash,
        $target = $(target);

        $('html, body').stop().animate({
            'scrollTop': $target.offset().top
        }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
});

<强>被修改

您可以使用jQuery hide和show

DEMO http://jsfiddle.net/kevinPHPkevin/raS55/

$('.About').click(function(){
    $('#About').show();
    $('#Contact').hide();
})
$('.Contact').click(function(){
    $('#Contact').show();
    $('#About').hide();
})

双div在同一个地方

2 个答案: