Javascript 根据用户单击的位置使页面向右或向左滑动

问题的标题可能不是最具描述性的，但基本上我想做的是，如果用户单击了当前活动链接右侧的链接，则让页面向右滑动；如果单击了当前活动链接左侧的链接，则让页面向左滑动

例如，我有一个页面的这一部分：

<header>
    <nav>
        <ul>
            <li><a href="/page/about">About</a></li>
            <li><a href="/page/contact">Contact</a></li>
            <li><a href="/page/services" class="yourehere">Services</a></li>
            <li><a href="/page/other">Other</a></li>
        </ul>
    </nav>
</header>

<section id="content">
     Page content here
</section>

这两个类用于使div向右滑动：

.animated {
-webkit-animation-duration: .4s;
animation-duration: .4s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

@keyframes fadeInRight {
0% {
opacity: 1;
-webkit-transform: translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}

100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}

.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}

如果任何人有任何关于如何实现我的目标的信息或技术，我将不胜感激。这个网站是我努力实现的一个完美的例子。 干杯：）

像这样吗

$(document).ready(function(){
    $("a").click(function(){
        if($(this).offset().left>$(".yourehere").offset().left){
            alert("SLide right");
        }else{
            alert("SLide left");
        }

    });
});

---

您引用的站点使用了它们自己的脚本和航路点。您可以查看以下内容：谢谢！你提到的那些网站帮了大忙

$(document).ready(function(){
    $("a").click(function(){
        if($(this).offset().left>$(".yourehere").offset().left){
            alert("SLide right");
        }else{
            alert("SLide left");
        }

    });
});