現在、Smooth Div Scroll (http://www.smoothdivscroll.com/) を使用して、Web サイトで「フルスクリーン」ポートフォリオを作成しようとしています。左のスクロールが右のスクロールよりもはるかに速いという問題があります。デモで、どちらも同じ速度であることに気付きましたが、私の人生ではなぜそれが機能しないのか理解できません. 以下にCSSとJSを貼り付けました。サイトへのリンクも用意しました。これを解決する方法について誰かがアイデアを持っていれば、本当に感謝しています!
CSS:
div#full-screen-portfolio {
width: 100%;
height: 100%;
overflow-y: hidden;
}
div.scrollWrapper
{
position: relative;
overflow: hidden;
width: 100%;
height: 100%;
}
div.scrollableArea
{
position: relative;
width: auto;
height: 100%;
}
div.scrollingHotSpotLeftVisible
{
width: 130px;
height: 200px;
top: 50%;
margin-top: -100px;
left: 20px;
position: absolute;
z-index: 1000;
background: url(images/full-screen-arrow-left.png) transparent no-repeat center center;
zoom: 1; /* Trigger "hasLayout" in Internet Explorer 6 or older versions */
}
div.scrollingHotSpotRightVisible
{
width: 130px;
height: 200px;
top: 50%;
margin-top: -100px;
right: 20px;
position: absolute;
z-index: 1000;
background: url(images/full-screen-arrow-right.png) transparent no-repeat center center;
zoom: 1;
}
body.full-screen-portfolio div#back-button {
position: absolute;
z-index: 1000;
top: 30px;
left: 30px;
}
body.full-screen-portfolio div#contact-us-area {
position: absolute;
bottom: 50px;
left: 0;
z-index: 1000;
}
body.full-screen-portfolio div#contact-us-area ul {
list-style: none;
margin: 0;
padding: 0;
}
body.full-screen-portfolio div#contact-us-area ul li {
float: left;
height: 91px;
}
JS:
$("#full-screen-portfolio").smoothDivScroll({
visibleHotSpotBackgrounds: "always",
hotSpotScrollingStep: 100
});
Webサイト:
http://lightboxwebsitedesign.co.uk/newsite/full-screen-portfolio/