title: Extjs Tooltips, IFrames and IE => Problems
body: <p>I have an application using <code>OpenLayers</code>, <code>Extjs</code> and <code>GeoExt</code>. My application runs fine, but I need it to be placed inside an <code>IFrame</code> in another page. When doing this, my toolbar becomes responseless in <em>Internet Explorer</em>. </p>
  
  <p>The cause is <strong>Ext.QuickTips.init();</strong>. Comment out this line and everything works fine - except the quick tips ofcourse =)</p>
  
  <p>But why is it causing problems? Is it because I'm using it wrong, placing it wrong or just because it doesn't like <em>Internet Explorer</em> and <code>IFrames</code>?</p>
  
  <hr>
  
  <p><strong>Link</strong>:</p>
  
  <p><a href="http://www.gis34.dk/iframetest.html" rel="nofollow noreferrer">Link to the IFrame page</a></p>
  
  <p><strong>IFrame</strong> page:</p>
  
  <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html&gt;
      &lt;body&gt;
          &lt;iframe height="660" src="http://www.gis34.dk/doctype.html" width="660"&gt;
            &lt;p&gt;This browser does not support &lt;i&gt;frames&lt;/i&gt;.&lt;/p&gt;
          &lt;/iframe&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>Application</strong> page:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  
  &lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
      &lt;script type="text/javascript" language="javascript"&gt;
          var map;
          var mapPanel;
          var mainViewport;
          var toolbarItems = [];
      &lt;/script&gt;
      &lt;link href="/Libraries/Ext/resources/css/ext-all.css" type="text/css"
      rel="stylesheet" /&gt;
      &lt;link href="/Libraries/GeoExt/resources/css/geoext-all-debug.css" type="text/css"
      rel="stylesheet" /&gt;
      &lt;link href="/CSS/Extjs.css" type="text/css" rel="stylesheet" /&gt;
      &lt;link href="/CSS/OpenLayers.css" type="text/css" rel="stylesheet" /&gt;
      &lt;link href="/CSS/Poseidon.css" type="text/css" rel="stylesheet" /&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;script src="/Libraries/OpenLayers/OpenLayers.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="/Libraries/Ext/adapter/ext/ext-base-debug.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="/Libraries/Ext/ext-all-debug.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="/Libraries/GeoExt/lib/GeoExt.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"
      type="text/javascript"&gt;&lt;/script&gt;
      &lt;div id="map"&gt;
      &lt;/div&gt;
      &lt;script type="text/javascript"&gt;
          Ext.onReady(function() {
              Ext.QuickTips.init(); // Uncomment this line!
  
              Ext.BLANK_IMAGE_URL = '/Libraries/Ext/resources/images/default/s.gif';
  
              var layer = new OpenLayers.Layer.OSM.Mapnik('OpenStreetMap Mapnik', {
                  sphericalMercator: true
              }, {
                  isBaseLayer: true
              });
  
              var mapOptions = {
                  projection: 'EPSG:900913',
                  units: 'm',
                  maxExtent: new OpenLayers.Bounds(1390414.0280576, 7490505.7050394, 1406198.2743956, 7501990.3685372),
                  minResolution: '0.125',
                  maxResolution: '1000',
                  restrictedExtent: new OpenLayers.Bounds(1390414.0280576, 7490505.7050394, 1406198.2743956, 7501990.3685372),
                  controls: [
                      ]
              };
              map = new OpenLayers.Map('', mapOptions);
  
              var Navigation = new OpenLayers.Control.Navigation();
              action = new GeoExt.Action({
                  control: new OpenLayers.Control.ZoomBox({
                      out: false
                  }),
                  map: map,
                  tooltip: "Zoom in",
                  iconCls: 'icon-zoom-in',
                  toggleGroup: 'mapTools',
                  group: 'mapTools'
              });
              toolbarItems.push(action);
              action = new GeoExt.Action({
                  control: new OpenLayers.Control.ZoomBox({
                      out: true
                  }),
                  map: map,
                  tooltip: "Zoom out",
                  iconCls: 'icon-zoom-out',
                  toggleGroup: 'mapTools',
                  group: 'mapTools'
              });
              toolbarItems.push(action);
  
              action = new GeoExt.Action({
                  control: new OpenLayers.Control.ZoomToMaxExtent(),
                  map: map,
                  iconCls: 'icon-zoom-max-extent',
                  tooltip: 'Zoom helt ud'
              });
              toolbarItems.push(action);
              map.addControl(Navigation);
              map.addLayer(layer);
  
              mapPanel = new GeoExt.MapPanel({
                  border: true,
                  id: 'mapPanel',
                  region: "center",
                  map: map,
                  tbar: toolbarItems
              });
              mainViewport = new Ext.Viewport({
                  layout: "fit",
                  hideBorders: true,
                  items: {
                      layout: "border",
                      deferredRender: false,
                      items: [
                          mapPanel
                          ]
                  }
              });
          });
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>