我最近对我的一个网站进行了一些小的编辑，其中使用了一个 javascript 滚动器（我在几年前在网上找到了它），突然它不再工作了。我想不出我会改变什么。这很奇怪，因为它在我的本地服务器（MAMP）上继续正常工作，但不再在网络上工作。
以下是无法正常工作的在线页面的链接：
http://tinyurl.com/scrollernotworking
如果在这里发布代码更有意义，这是我的 html：
<!doctype html>
<html><!-- InstanceBegin template="/Templates/scroll.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta charset="UTF-8">
<!-- InstanceBeginEditable name="doctitle" --><title>TEST SCROLLER ONLINE</title><!-- InstanceEndEditable -->
<!-- InstanceParam name="id" type="text" value="staff" -->
<style type="text/css">
@import url(test.css);
</style>
<script type="text/javascript" src="../javascript/jsScroller.js"></script>
<script type="text/javascript" src="../javascript/jsScrollbar.js"></script>
<script type="text/javascript">
var scroller = null;
var scrollbar = null;
window.onload = function () {
scroller = new jsScroller(document.getElementById("Scroller"), 400, 200);
scrollbar = new jsScrollbar (document.getElementById("Scrollbar-Container"), scroller, false);
}
</script>
</head>
<body id="staff">
<div id="content">
<div id="Scroller">
<div class="Scroller-Container"><!-- InstanceBeginEditable name="text" -->
<div id="lipsum">
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur posuere nisi sed tortor molestie sodales. In at turpis id nibh eleifend porta. Sed risus dui, eleifend non sem eget, tempor adipiscing mauris. In sodales sem vel commodo pretium. Phasellus vulputate velit a imperdiet tristique. Nunc a lacus ut elit sagittis bibendum. Ut vel quam nunc. Aenean hendrerit nulla eu ligula porttitor accumsan. </p>
<p> Duis turpis justo, commodo ac massa rhoncus, rhoncus semper massa. Nullam faucibus leo ut tempor tempus. Mauris a elementum nibh, non congue felis. Curabitur eu nibh mauris. Maecenas quis fringilla augue. Morbi id malesuada nisl. Donec nec aliquam purus. Proin at malesuada justo. Vivamus tempor velit lectus, a sagittis nisl mollis eu. Donec at enim laoreet, rhoncus nulla posuere, consequat elit. Nam vel ante eros. Phasellus laoreet tempus mattis. Phasellus a fringilla neque. Nulla rutrum nibh quis malesuada sollicitudin. Etiam suscipit nibh eu porttitor tristique. </p>
<p> Ut aliquam, diam sit amet dapibus imperdiet, nisl augue pharetra odio, in interdum tortor quam non sem. Nulla molestie rhoncus sem eget tincidunt. Sed vel velit fermentum, sagittis turpis vel, accumsan nibh. Aliquam erat volutpat. Fusce leo est, pharetra eu tortor non, sollicitudin tempor ligula. Proin nec adipiscing erat, at suscipit tellus. Nullam scelerisque porta iaculis. Cras est tortor, scelerisque non vestibulum eu, pellentesque vel magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; </p>
<h2> Heading Example 1</h2>
<p>ullam accumsan leo erat, in interdum quam luctus ac. In nulla mi, sodales a aliquet at, gravida nec mauris. Quisque nec interdum diam. Etiam fermentum pulvinar dolor in cursus. Ut hendrerit porta ullamcorper. In lobortis neque sed sem condimentum, quis feugiat elit consequat. In eu erat mi. </p>
<p> Nulla ornare egestas libero nec tempus. Sed id ornare enim. Maecenas pharetra massa sed augue sodales vestibulum. Suspendisse potenti. Duis et accumsan justo, a dictum velit. Aliquam ultricies eleifend sagittis. Cras in risus est. Sed molestie urna elit, eget varius magna euismod sit amet. </p>
<h2> Heading Example 2</h2>
<p>Sed turpis elit, hendrerit eu diam nec, vulputate laoreet lectus. Pellentesque volutpat erat vel nisl tincidunt feugiat. Vestibulum quam sem, condimentum eu ultrices eu, scelerisque a turpis. Duis condimentum dictum lectus, in ornare lacus vehicula posuere. Ut venenatis urna ac euismod bibendum. Aenean eu arcu cursus, fermentum mi at, interdum libero. Praesent tincidunt tortor eu ultrices viverra. Fusce in velit a mi euismod mollis. Suspendisse venenatis congue justo, at luctus enim. Aliquam nec volutpat erat. </p>
<p> Fusce fringilla sapien magna, ac bibendum turpis condimentum sed. Donec posuere, nunc et rhoncus dapibus, velit magna semper leo, sed commodo odio enim feugiat magna. Nam aliquet turpis eu lectus ultricies, eget tempor urna eleifend. Aliquam sit amet magna volutpat nunc pretium accumsan quis nec erat. Fusce volutpat porta ipsum nec adipiscing. Donec eu enim molestie ante sollicitudin consequat eget at arcu. Ut id ante eget metus porttitor imperdiet. Fusce faucibus nunc vel elit convallis, eu iaculis nulla semper. Vivamus ullamcorper diam libero, non dignissim dolor vestibulum et. Vivamus in volutpat nunc. Aliquam erat volutpat. Maecenas massa massa, congue quis tortor at, interdum laoreet augue. Aenean mattis lacus dui, quis ullamcorper massa tincidunt quis. </p>
<h2> Heading Example 3</h2>
<p>Nullam sit amet porta urna. Pellentesque quis tristique diam. Sed ac porta urna. Nunc porttitor eget nibh id ornare. Duis a nunc a purus ultrices pretium eu et lacus. Duis auctor condimentum ligula, nec commodo lectus eleifend sed. Cras varius adipiscing feugiat. Mauris posuere sem a ultrices adipiscing. Sed id lectus tortor. Aenean vitae rhoncus turpis, a vulputate purus. Etiam rutrum nulla sit amet urna hendrerit bibendum. Donec laoreet porttitor risus nec porttitor. </p>
</div>
<div id="generated"></div>
<!-- InstanceEndEditable --></div><!--close Scroller-Container-->
</div><!--close Scroller-->
<div id="Scrollbar-Container">
<div class="Scrollbar-Track">
<div class="Scrollbar-Handle"></div><!--close Scrollbar-Handle-->
</div><!--close Scrollbar-Track-->
<!-- InstanceBeginEditable name="homepage-calltoActions" --><!-- InstanceEndEditable -->
</div><!--close Scrollbar-Container-->
</div><!--close Content-->
</body>
<!-- InstanceEnd --></html>
这是我的CSS：
html, body {
height:100%;
width:100%;
}
body {
margin:0;
padding:50px;
background-color:#676B62;
line-height:135%;
font-family:Verdana,Arial, Helvetica, sans-serif;
color:#333;
}
p {
margin:0 0 15px 0;
line-height:145%;
}
h2 {
font-size:1.1em;
margin:0 0 9px 0;
text-transform:none;
font-weight:bold;
line-height:140%;
}
#content {
float:left;
width:700px;
min-height:469px; /** added min to test ****/
margin:0;
padding:50px;
background-color:#FFC;
}
/*************** Scroller CSS **************/
#Scroller {
text-align:left;
font-size:12px;
position:absolute;
width: 590px;
height: 375px;
overflow: hidden;
margin:0;
line-height:135%;
/*background-color:#6CF;*/
}
.Scroller-Container {
position: absolute;
}
.Scrollbar-Track {
width: 20px;
height: 375px;
position: absolute;
background-color:#ccd59a;
margin:0 0 0 605px;
}
.Scrollbar-Handle {
position: absolute;
top: 0px;
left: 0px;
width: 20px;
height: 30px;
background-color: #81943B;
background-image:url(images/site/scrollbar-handle.gif);
background-repeat:no-repeat;
}
并且 javascript 没有被我修改过，因为它原来工作得很好，但你可以在上面链接页面的头部看到它链接到。
任何人都可以提供任何帮助，我将不胜感激！
提前非常感谢......我花了几个小时试图弄清楚我可能不小心改变了什么，但无济于事:(