1. #1
    Sencha User
    Join Date
    Mar 2012
    Location
    India
    Posts
    20
    Vote Rating
    0
    AswaniKumar is on a distinguished road

      0  

    Default Unanswered: Iframe scrolling whole panel is it possible to scroll particular iframe.

    Unanswered: Iframe scrolling whole panel is it possible to scroll particular iframe.


    I am creating iframe assign some src. In the same page tab bar contains 4 tabs. after loading the iframe src web page the panel have been re sized to the webpage size.scroll the whole panel tab bars also. I want to display the webpage with the panel size provide scrolling for the iframe only is it possible if any one knows plz give reply...

    this is my source.

    Ext.define('Ext.ux.IframeComponent', {
    extend: 'Ext.Component',
    xtype: 'iframecmp',
    config: {
    url : null,
    baseCls : Ext.baseCSSPrefix + 'iframe'
    },
    initialize: function() {
    var me = this;
    me.callParent();
    me.iframe = this.element.createChild({
    tag : 'iframe',
    src : this.getUrl(),
    style : 'width: 200px; height: 300px;float:left;overflow:hidden;'
    });
    me.relayEvents(me.iframe, '*');
    }
    });


    Ext.define('FirstApp.view.Weather',{
    extend:'Ext.Panel',


    xtype:'weather',
    config:{
    items:[
    {
    title : 'Google',
    iconCls : 'action',
    xtype : 'iframecmp',
    url : 'http://weather.com'
    }
    ]
    }
    });

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,642
    Vote Rating
    899
    Answers
    3574
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Interactions like scrolling will only be on the top document so iframes are child documents of the top document and will not receive the events.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Mar 2012
    Location
    India
    Posts
    20
    Vote Rating
    0
    AswaniKumar is on a distinguished road

      0  

    Default


    Thank you.

    Is there any other way to scroll the webpage with in the panel size.

  4. #4
    Sencha User
    Join Date
    Mar 2012
    Posts
    31
    Vote Rating
    5
    chrisminniti is on a distinguished road

      0  

    Default


    i know this isn't the answer you want, but I would really try not to use iframes. They do not perform well in Sencha.

  5. #5
    Sencha User
    Join Date
    Mar 2012
    Location
    India
    Posts
    20
    Vote Rating
    0
    AswaniKumar is on a distinguished road

      0  

    Default


    I am also trying so many ways but not working. in which way you reached your requirement. give me any suggestion if you know how to display the web page in sencha 2 with out the iframe concept.

  6. #6
    Sencha User
    Join Date
    Nov 2011
    Posts
    37
    Vote Rating
    1
    chot2 is on a distinguished road

      0  

    Default


    hi AswaniKumar did u find any solution for this ?

  7. #7
    Sencha User
    Join Date
    Mar 2012
    Location
    India
    Posts
    20
    Vote Rating
    0
    AswaniKumar is on a distinguished road

      0  

    Default


    No. I doesn't find any solution searching for the solution using phonegap. I have found the link shown below, but I have not apply to my application.

    http://a.shinynew.me/post/1978677538...browser-plugin

  8. #8
    Sencha User nareshkokkula's Avatar
    Join Date
    Feb 2012
    Posts
    44
    Vote Rating
    -3
    Answers
    1
    nareshkokkula can only hope to improve

      0  

    Default should have a parent div for iframes in iOS devices

    should have a parent div for iframes in iOS devices


    Code:
    Ext.define('EmbeddedPage', {
        extend: 'Ext.Component',
        xtype: 'embeddedpage',
    
    
        scrollable: {
            direction: 'both',
            directionLock: false
        },
    
    
    
    
        constructor: function () {
            this.callParent(arguments);
        },
    
    
        initialize: function () {
            this.callParent(arguments);
            this.addEvents('ValueUpdated');
            this.on('painted',
        function () {
            Ext.DomHelper.append(this.element, {
                tag: 'div',
                style: 'width: 100%; height:100%; overflow:auto; -webkit-overflow-scrolling : touch; scrolling: yes;',
                children: [{
                    tag: 'iframe',
                    src: this.src,
                    id: this.id + '-iframe',
                    style: 'width: 100%; height:100%; overflow:auto; -webkit-overflow-scrolling : touch; '
                }]
            });
        });
        },