理解JavaScript滚动和iFrames
理解JavaScript滚动和iFrames
提问于 2013-04-30 14:48:18
问题
我有一个Flash被加载到一个PHP页面中，然后加载到一个Facebook画布中。FB页面的内容在右侧广告区域，它创建一个垂直滚动条，而不管我的游戏内容的高度。我的游戏的画布有一个流畅的高度，以充分填充画布的内容区域。
在我的游戏中有一个缩放功能，它是由鼠标轮触发的。
当使用鼠标轮(在我的游戏中放大)，这也是被浏览器拿起滚动内容。因此，我得到了一个同时缩放/滚动的效果，至少可以说这是不可取的。
问题
我知道我的游戏内容在FB应用程序的iframe不能直接点击App页面。因此，尝试在FB页面上设置属性是毫无意义的。但我在想，有没有办法在我的游戏内容上捕捉滚动事件，阻止它到达包装FB页面？
我不太了解DOM，不知道这是否可能。我的想法就像一个Flash开发人员，因为我们可以停止事件传播。我只是不知道滚动事件是从哪个方向或从哪个DOM元素开始的。
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-04-30 15:28:13
我解决了这个问题(我想).
我之所以不能停止FB应用程序的滚动，是因为如果画布是流动的，那么内容就不会溢出？而不是触发滚动事件。但是，它将触发鼠标轮事件，这是通过鼠标生成滚动事件的必要步骤。
我在内容div中添加了代码，通过该代码可以侦听鼠标轮事件。然后，我取消该事件&停止它向iFrame的所有者传播。
<html>
<head>
<script type="text/javascript">
function init ()
{
//window.addEventListener('scroll', listener, false);
}
</script>
</head>
<body onload="init()">
<script type="text/javascript">
function onScrollHandler(event)
{
event.preventDefault();
event.stopPropagation();
//alert("scrolling");
}
</script>
<div id="content" onmousewheel="onScrollHandler(event)" onclick="alert('click')" style="position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background-color:#b0c4de;">
content area
</div>
</body>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/16302789
复制相关文章
相似问题
腾讯云开发者
