2013-08-12 25 views
0

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

代码:

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]); 

     }, 

回答

0

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

+0

我试过dragstart事件中的stopPropagation方法,但它也不起作用。 –

相关问题