1. #1
    Sencha User
    Join Date
    Feb 2012
    Location
    New York
    Posts
    23
    Vote Rating
    0
    nd_sencha is on a distinguished road

      0  

    Question Answered: iframes

    Answered: iframes


    Is it possible to have an iframe on the page using sencha touch?


  2. #2
    Sencha User
    Join Date
    Feb 2012
    Location
    New York
    Posts
    23
    Vote Rating
    0
    nd_sencha is on a distinguished road

      0  

    Default


    This doesn't make the frame scrollable, am I missing something?



    Code:
    items : {				xtype: 'panel',
    				scroll: 'both',
    				items: [{
    				id: 'iframe',
    				scroll: "vertical",
    				layout: 'vbox',
    				width: '100%',
    				height: '100%',
    				html: ['<div style="width:100%; position:fixed; background-color:Transparent;"></div>',
    						  '<iframe width="100%" height="100%" src="http://www.link.com"></iframe>']
    						}]
    			},

  3. #3
    Sencha - Services Team arthurakay's Avatar
    Join Date
    Sep 2008
    Location
    Antioch, IL
    Posts
    1,317
    Answers
    58
    Vote Rating
    23
    arthurakay has a spectacular aura about arthurakay has a spectacular aura about arthurakay has a spectacular aura about

      0  

    Default


    There's no reason you can't have an IFRAME... Sencha Touch is simply rendering elements to the DOM, just like any other HTML file.

    As for why the IFRAME in your example isn't scrollable... the URL for your IFRAME doesn't have any content, so maybe you just need to link to a page that has content taller/wider than the IFRAME itself.
    Arthur Kay
    Developer Relations Manager, Sencha Inc.

    Twitter | Sencha Chicago User Group

  4. #4
    Sencha User
    Join Date
    Feb 2012
    Location
    New York
    Posts
    23
    Vote Rating
    0
    nd_sencha is on a distinguished road

      0  

    Default


    The link i used here was just a dummy link. The link which I would like to use in the iframe has content in it.

    This code gives output, but it even has a scroll bar inside, please look at the image.

    iframe.jpg

  5. #5
    Sencha - Services Team arthurakay's Avatar
    Join Date
    Sep 2008
    Location
    Antioch, IL
    Posts
    1,317
    Answers
    58
    Vote Rating
    23
    arthurakay has a spectacular aura about arthurakay has a spectacular aura about arthurakay has a spectacular aura about

      0  

    Default


    PHP Code:
    new Ext.Application({
        
    name 'App',

        
    launch : function () {
            new 
    Ext.Panel({
                
    fullscreen true,
                
    layout     'fit',
                
    items      : [
                    {
                        
    xtype  'panel',
                        
    scroll 'vertical',
                        
    layout 'fit',
                        
    html   '<iframe width="100%" height="100%" src="http://www.test.com"></iframe>'
                    
    }
                ]
            });
        }

    }); 
    This seems to work fine for me, using ST 1.1.1
    Arthur Kay
    Developer Relations Manager, Sencha Inc.

    Twitter | Sencha Chicago User Group

  6. #6
    Sencha User
    Join Date
    Feb 2012
    Location
    New York
    Posts
    23
    Vote Rating
    0
    nd_sencha is on a distinguished road

      0  

    Default


    Yes, I'm using ST 1.1, I still can't get rid of the scroll bar, it is showing the output but with the scroll bar, is it supposed to be there? I have no idea why scroll: 'vertical', not working inside the items



    Code:
    Ext.setup({
            fullscreen: true,
            glossOnIcon: false,
            scroll: "vertical",
            title: "title",
            onReady: function() {
    
    
             new Ext.Panel({
                fullscreen : true,
                scroll : "vertical",
    
    items: [{
                xtype: 'panel',
                scroll: 'vertical',
                items: [{
                id: 'iframe',
                           layout : 'fit', 
                width: '100%',
                height: '100%',
                html: ['<div style="width:100%; position:fixed; background-color:Transparent;"></div>',
                  '<iframe width="100%" height="100%" src="http://www.dummylink.com/abc.php"></iframe>']
                    }]
            }],
    
    });
          }
    });

  7. #7
    Sencha - Services Team arthurakay's Avatar
    Join Date
    Sep 2008
    Location
    Antioch, IL
    Posts
    1,317
    Answers
    58
    Vote Rating
    23
    arthurakay has a spectacular aura about arthurakay has a spectacular aura about arthurakay has a spectacular aura about

      0  

    Default


    I guess I'm failing to understand you... you do or do not want a scrollbar inside the iframe?

    I'm pretty sure that the iframe will have a scroll bar if it's content is taller than the frame. Setting the scroll config will apply to the content the panel/container can control... but I'm not sure they can control the iframe scroller.

    Maybe someone with more experience with IFRAMES can step in.
    Arthur Kay
    Developer Relations Manager, Sencha Inc.

    Twitter | Sencha Chicago User Group

  8. #8
    Sencha User
    Join Date
    Feb 2012
    Location
    New York
    Posts
    23
    Vote Rating
    0
    nd_sencha is on a distinguished road

      0  

    Default


    I would like it to scroll without the scroll bar, what my understanding is, that it will be difficult to scroll using a scroll bar on the touch phone.

  9. #9
    Sencha - Services Team arthurakay's Avatar
    Join Date
    Sep 2008
    Location
    Antioch, IL
    Posts
    1,317
    Answers
    58
    Vote Rating
    23
    arthurakay has a spectacular aura about arthurakay has a spectacular aura about arthurakay has a spectacular aura about

      0  
    Arthur Kay
    Developer Relations Manager, Sencha Inc.

    Twitter | Sencha Chicago User Group

  10. #10
    Sencha User
    Join Date
    Feb 2012
    Location
    New York
    Posts
    23
    Vote Rating
    0
    nd_sencha is on a distinguished road

      0  

    Default


    Thanks, this helped. I did't know we could use height="130%"

Thread Participants: 2

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar