滚动自动化不会在最后一个链接上停止
Scroll Automation Wont Stop on Last Link
我有一个JavaScript函数,它不能正常工作。它适用于所有链接,除了最后一个链接。当该链接被触发时,它会滚动到底部,然后不允许您向上滚动......尽管我尽了最大的努力。
也许我的做法是完全错误的。
下面是标记:
<nav>
<ul>
<li>
<a id="home" href="#" onclick="return false">home</a>
</li>
<li>
<a id="services" href="#" onclick="return false">services</a>
</li>
<li>
<a id="portfoliolink" href="#" onclick="return false">portfolio</a>
</li>
<li>
<a id="contactlink" href="#" onclick="return false">contact</a>
</li>
</ul>
</nav>
和javascript:
function smoothScroll(){
if (window.addEventListener){
document.getElementById('home').addEventListener("click", scrollToHome, false);
document.getElementById('services').addEventListener("click", scrollToServices, false);
document.getElementById('portfoliolink').addEventListener("click", scrollToPortfolio, false);
document.getElementById('contactlink').addEventListener("click", scrollToContact, false);
}
};
function scrollToHome(){
var scrollY = 0;
var distance = 40;
var speed = 24;
var currentY = window.pageYOffset;
var targetY = document.getElementById('chris-misterek').offsetTop;
var bodyHeight = document.body.offsetHeight;
var yPos = currentY + window.innerHeight;
var animator = setTimeout('scrollToHome("chris-misterek")',24);
if(currentY < targetY-distance){
scrollY = currentY+distance;
window.scroll(0, scrollY);
}
else {
clearTimeout(animator);
}
};
function scrollToServices(){
var scrollY = 0;
var distance = 10;
var currentY = window.pageYOffset;
var targetY = document.getElementById('what-we-do').offsetTop;
var bodyHeight = document.body.offsetHeight;
var yPos = currentY + window.innerHeight;
var animator = setTimeout('scrollToServices("what-we-do")',4);
if(currentY < targetY-distance){
scrollY = currentY+distance;
window.scroll(0, scrollY);
}
else {
clearTimeout(animator);
}
};
function scrollToPortfolio(){
var scrollY = 0;
var distance = 10;
var currentY = window.pageYOffset;
var targetY = document.getElementById('portfolio').offsetTop;
var bodyHeight = document.body.offsetHeight;
var yPos = currentY + window.innerHeight;
var animator = setTimeout('scrollToPortfolio("portfolio")',4);
if(currentY < targetY-distance){
scrollY = currentY+distance;
window.scroll(0, scrollY);
}
else {
clearTimeout(animator);
}
};
var scrollY = 0;
var distance = 40;
var speed = 24;
function scrollToContact() {
var currentY = window.pageYOffset;
var targetY = document.getElementById('contact').offsetTop;
var bodyHeight = document.body.offsetHeight;
var yPos = currentY + window.innerHeight;
var animator = setTimeout('scrollToContact("contact")',24);
if(yPos > bodyHeight){
clearTimeout(animator);
} else {
if(currentY < targetY-distance){
scrollY = currentY+distance;
window.scroll(0, scrollY);
} else {
clearTimeout(animator);
}
}
};
window.onload = smoothScroll;
发现我需要为 if(yPos> bodyHeight) 语句添加一个大于等于 正确的代码如下所示:
function scrollToContact() {
var currentY = window.pageYOffset;
var targetY = document.getElementById('contact').offsetTop;
var bodyHeight = document.body.offsetHeight;
var yPos = currentY + window.innerHeight;
var animator = setTimeout('scrollToContact("contact")',24);
if(yPos >= bodyHeight){
clearTimeout(animator);
} else {
if(currentY < targetY-distance){
scrollY = currentY+distance;
window.scroll(0, scrollY);
} else {
clearTimeout(animator);
}
}
};
相关文章:
- 点击jsp页面上的链接打开一个文件
- 我想让HTML链接打开一个js手风琴
- 使用 JavaScript 向一组链接中的第一个链接添加一个属性
- 为链接打开一个新窗口,但希望下一页仍在“主体”框架中
- 使用JavaScript和html将图像和超链接从一个位置随机移动到另一个位置
- JS:用链接替换链接.还有一个链接
- Primefaces链接打开一个电子邮件撰写窗口
- 如何在jquery中链接另一个HTML页面到海报图像
- Javascript为所有链接附加一个onclick事件
- 如何使第一个链接打开一个特定的链接
- 如何通过单击第二个超链接禁用一个超链接
- 在Dojo中单击链接打开一个弹出窗口或工具提示
- 邮件链接在一个邮件的主题行不工作使用javascript
- PHP动态表与编辑/删除链接打开一个弹出
- VBScript点击链接在一个网页表调用嵌入(?)Javascript函数
- 我如何有链接打开一个特定的选项卡内引导模态
- 同一链接在一个页面中重复多次,单击其中一个会改变所有相同链接的颜色
- 我如何打开这个tr链接在一个新的选项卡,而不是相同的
- 如何从gInfowindow链接打开一个花哨的盒子
- 如何使用按钮链接另一个页面