can't use iframe in tab panel created with ContentPanel()?

**kirk** · 20 Nov 2006 4:12 AM

I use YAHOO.ext.ContentPanel() to create tab panel. But one strange thing happen, image or button in iframe is not visible, but plain text can be see. I use yui-ext.0.33-beta4 and BorderLayout to create tab panel.

This happen with IE 6.0, but with FF 1.5.0.8, it's OK!

Any hints? Thanks!

The iframe html file is simple:
<html>
<body>
<img src="img/test.gif border=0>hello
</body>
</html>

'test.gif' image is not visible, 'hello' can be see.

**jarrod** · 20 Nov 2006 7:03 AM

Erm.. missing close double-quote after .gif?

**kirk** · 20 Nov 2006 4:32 PM

The demo code is here:

<html>
<head>
<link rel="stylesheet" type="text/css" href="../yui/reset/reset-min.css">
<script type="text/javascript" src="../yui/build/yahoo/yahoo.js"></script>
<script type="text/javascript" src="../yui/build/dom/dom.js"></script>
<script type="text/javascript" src="../yui/build/event/event.js"></script>
<script type="text/javascript" src="../yui/build/connection/connection.js"></script>
<script type="text/javascript" src="../yui/build/dragdrop/dragdrop.js"></script>
<script type="text/javascript" src="../yui/build/animation/animation.js"></script>

<script type="text/javascript" src="util.js"></script>
<script type="text/javascript" src="../yui-ext.0.33-rc1/yui-ext-debug.js"></script>
<script type="text/javascript" src="../yui-ext.0.33-rc1/examples/ie-bg.js"></script>

<link rel="stylesheet" type="text/css" href="../css/layout.css"/>
<link rel="stylesheet" type="text/css" href="../css/grid.css"/>
<link rel="stylesheet" type="text/css" href="../css/tabs.css"/>
<link rel="stylesheet" type="text/css" href="../css/resizable.css"/>
<script type="text/javascript">
Example = function(){
var navPanel;

return {
init : function(){
var layout = new YAHOO.ext.BorderLayout(document.body, {
west: {
split:true,
initialSize: 200,
titlebar: true,
collapsible: true,
minSize: 100,
maxSize: 400
},
center: {
autoScroll: false,
tabPosition: 'top',
closeOnTab: true,
alwaysShowTabs: true
}
});
layout.beginUpdate();

navPanel = new YAHOO.ext.ContentPanel('nav', {title: 'Navigation', fitToFrame:true, closable:false});
layout.add('west', navPanel);
layout.add('center', new YAHOO.ext.ContentPanel('main', {title: 'Auto Tabs', closable: true}));
layout.add('center', new YAHOO.ext.ContentPanel('autoTabs', {title: 'Auto Tabs', closable: true}));
layout.getRegion('center').showPanel('main');

// restore any state information
layout.restoreState();
layout.endUpdate();
}
}
}();
YAHOO.ext.EventManager.onDocumentReady(Example.init, Example, true);

</script>
</head>
<body>
<div id ="container">
<div id="nav" class="ylayout-inactive-content">
</div>
<div id="main" class="ylayout-inactive-content">
<iframe id="fileIframe2" src="iframe_demo.html" frameborder="2" height=54 width=124></iframe>
</div>
<div id="autotabs" class="ylayout-inactive-content">
</div>
</div>
</body>
</html>

iframe_demo.html:

<html>
<body>
[img]../images/grid/drop-yes.gif[/img]hello
</body>
</html>

Of course, path to js, css and images may need modification if you want to show it on your system.

In FF 1.5.0.8, image shows as expected, but IE 6.0 not!

Any hints are appreciated.
Thanks!

can't use iframe in tab panel created with ContentPanel()?

Thread Tools

Search Thread

Display

can't use iframe in tab panel created with ContentPanel()?

can't use iframe in tab panel created with ContentPanel()?

sorry, that's a typo, but not that cause the problem!

sorry, that's a typo, but not that cause the problem!

Similar Threads

Iframe and src attribute in a contentpanel

iframe to contentpanel

issues with dynamically created ContentPanel tabs

iframe problem in tabPanel created by ContentPanel() in IE6

iframe inside ContentPanel