0

在我的 Sencha 应用程序中,我正在显示一个带有 iframe 的网页。当我滚动 iframe 的内容时,它的容器面板也随之滚动。由于它有时 iframe 不能正确滚动。是否需要更改 iframe 或面板的样式/css ..?

代码 :

Ext.define('Example.view.Dashboard', {
       extend : "Ext.Panel",
       alias : "widget.dashboard",
       config : {           
       layout: 'vbox',
       scrollable : false,                               
       hideAnimation : {
       type : "slideOut",
       direction : 'down',
       duration : 500
       },

       showAnimation : {
       type : "slideIn",
       direction : 'up',
       duration : 500
       },
       },

       initialize : function() {

       this.callParent(arguments);


       var cancelButton = {
       ui : "normal",          
       handler : this.onBackButtonTap,
       scope : this,
       id : 'cancelDashboardButton',
       itemId : 'cancelDashboardButton',         
       cls : 'button-left-arrow',
       };

       var topToolbar = {
       xtype : "titlebar",
       docked : "top",
       cls : 'header',
       name : 'detailToolbar',
       title : "Dashboards",
       itemId : 'dashboard-title',
       items : [cancelButton]
       };


       var bottomToolbar = {
       xtype : "toolbar",
       docked : "bottom",
       cls : 'footer',
       };

       this.add([topToolbar,
    {
               xtype : 'panel',
               itemId:'webContainer',
               flex:50,
               html : '<div style="-webkit-overflow-scrolling:touch; height: 1000px;     overflow: auto;"><iframe src="http://www.metacube.com/" border="0" frameborder="no" style="height:100%;width:100%;"> <iframe/></div>',
            },
                 bottomToolbar]);

       },
4

1 回答 1

0

也许您可以dragstart在嵌套 iframe 上侦听事件,然后stopPropagation在处理程序上调用事件方法。这应该防止事件传播到父容器并滚动它。

于 2013-08-17T22:53:47.147 回答