iFrame隐藏滚动条,但仍然可以用鼠标滚轮滚动

我想要做的是制作iPhone模拟器,并在iFrame中显示网页。 滚动条占用了太多空间,所以我想隐藏它们,但仍然有滚动的能力。

这是HTML:

<div id="iphone">
    <iframe src="http://site.com" width="307" height="443"><p>Your Browser does not support iFrames.</p></iframe>
</div>

CSS:

#iphone { background:url(iPhone.png) no-repeat; width:368px; height:706px; position:relative; overflow:hidden;  }
#iphone iframe { position:absolute; left:30px; top:143px; border:0;overflow:hidden; }

现在它运行良好,滚动条被隐藏,但我无法滚动。 我可以使用我的箭头键,它工作正常,但我真的想要使用鼠标滚轮的能力

有没有人有任何想法?


这应该给你你需要检测鼠标轮的运动:http://www.adomas.org/javascript-mouse-wheel/

这应该给你你需要控制页面的滚动:http://www.mediacollege.com/internet/javascript/page/scroll.html

检测鼠标滚轮,确定方向,相应滚动。

链接地址: http://www.djcxy.com/p/88113.html

上一篇: iFrame Hide Scroll bars but still be able to scroll with mouse wheel

下一篇: hide scrollbar while still able to scroll with mouse/keyboard