j***ascript横向滚动,js横向滚动条-北京沣登科技发展公司

大家好，今天小编关注到一个比较有意思的话题，就是关于javascript 横向滚动的问题，于是小编就整理了3个相关介绍 java script横向滚动的解答，让我们一起看看吧。

如何制作上下滑动翻页的网页？
用js如何在父页面控制iframe子页面中滚动条的位置？
js如何监听屏幕滚动到底了？

如何 制作 上下 滑动翻页的网页？

var ele = document.getElementsByClassName("img-box")[0]; var beginX, beginY, endX, endY, swipeLeft, swipeRight; ele.addeventListener('touchstart', function (event) { event.stopPropagation(); event.preventDefault(); beginX = event.targetTouches[0].screenX; beginY = event.targetTouches[0].screenY; swipeLeft = false, swipeRight = false; }); ele.addEventListener('touchmove', function (event) { event.stopPropagation(); event.preventDefault(); endX = event.targetTouches[0].screenX; endY = event.targetTouches[0].screenY; // 左右滑动 if (Math.abs(endX - beginX) - Math.abs(endY - beginY) > 0) { /*向右滑动*/ if (endX - beginX > 0) { swipeRight = true; swipeLeft = false; } /*向左滑动*/ else { swipeLeft = true; swipeRight = false; } } else if(Math.abs(endX - beginX) - Math.abs(endY - beginY) < 0) { // 上下滑动 } }); ele.addEventListener('touchend', function (event) { event.stopPropagation(); event.preventDefault(); if (Math.abs(endX - beginX) - Math.abs(endY - beginY) > 0) { event.stopPropagation(); event.preventDefault();if (swipeRight) { swipeRight = !swipeRight; /*向右滑动*/ } if(swipeLeft) { swipeLeft = !swipeLeft; /*向左滑动*/ } } });

除了这种方法之外可以使用第三方插件来实现同样的效果，如QuoJS包含了多种移动端手势效果及ajax 请求等操作，但是在使用过程中遇到了问题。使用了QuoJS后，会造成JQuery的一些单击事件和一些a标签href属性失效。并且发现QuoJS的swipeLeft和swipeRight***中，手指只能水平滑动，如果稍微倾斜一点滑动，则***不生效，也不知道是不是本人的设备问题。

div>

（图片来源网络，侵删）

用js如何在父页面 控制 iframe子页面中滚动条的位置？

window.frames[index].frameElement.contentWindow这个是对应的iframe的windowwindow.frames[index].frameElement.contentWindow.scrollTo(x,y)调用对应的iframe的滚动条.scrollBy(x,y).scroll(x,y)调用滚动条的其他方法本人只测试到ie9,9以下自行测试