zoukankan      html  css  js  c++  java
  • zz 用JS控制Iframe鼠标的中轴滚动事件,并使鼠标在ifrme内时,父窗口滚动失效

    http://hi.baidu.com/%D4%AC%BC%AA%BA%BD/blog/item/ce69b137a03aecd4a2cc2b65.html

    在做WebGis时要实现用鼠标的中轴来控制地图的放大缩小,但是当鼠标在IFRAME里面上下滚动的时候,整个页面都跟随者上下滚动了,达不到理想的效果,试了N种办法,无解。

    经过千辛万苦的实验,终于找到了解决方法,需要为JS添加一个事件,当鼠标在Iframe页面里面滚动的的时候,使父窗口滚动禁用。代码如下:

        鼠标滚动事件代码:

            function sdZoom()
        {
            //alert(event.wheelDelta);
            window.top.topmapFrame.focus();      //首先使Iframe获得焦点
            var strDate = new Date();
            if(event.wheelDelta>=120)        //向上滚动鼠标事件
            {//放大
                    eval(zoomIn);      //js控制放大
            }
            else if(event.wheelDelta<=-120)     //向下滚动鼠标事件
            { 
                    eval(zoomOut);   //js控制缩小
            }
        }

       以上是实现了js控制鼠标滚动放大缩小的功能,最主要的代码在下面,不让父窗口跟随滚动,在Iframe里面连接的页面里面加上如下的JS代码;

    <script type="text/javascript">
        if(document.addEventListener)

          {
                document.addEventListener("DOMMouseScroll",function(e){
                 e.preventDefault();
                  },false);
          }

        else{
                 document.onmousewheel = function(){
                event.returnValue = false;
       };
    }

    </script>

    哈哈,问题解决

    --------------------- 我可以操纵冰冷的代码,但我操纵不了我的人生...... [url=http://www.puya360.com]西安普雅软件工作室[/url]
  • 相关阅读:
    【SAS NOTE】OUTPUT
    【SAS NOTES】_NULL_
    【SAS NOTE】sas 9.2 安装
    【SAS NOTE】FREQ
    纯数学教程 Page 203 例XLI (1)
    纯数学教程 Page 203 例XLI (3)
    纯数学教程 Page 203 例XLI (2)
    Prove Cauchy's inequality by induction
    纯数学教程 Page 325 例LXVIII (15) 调和级数发散
    纯数学教程 Page 325 例LXVIII (15) 调和级数发散
  • 原文地址:https://www.cnblogs.com/ternastone/p/1901746.html
Copyright © 2011-2022 走看看