Home/ Questions/Q 8863073
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T15:53:04+00:00

This problem only occurs on IE8 (not IE8 compatibility mode). I have a file

  • 0

This problem only occurs on IE8 (not IE8 compatibility mode).
I have a file called sample.htm:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
    <script src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.js' type='text/javascript'></script>
</head>
<body style='position:relative;z-index:1'>
<input><a href="javascript:Popup('test1.html');">Click</a>
<script>
function Popup(url) {
    overlay = $("<div style='position:fixed; width:100%; height:100%; z-index:10005'><div style='position:absolute; width:100%; height:100%; background:black; -ms-filter:\"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)\"; filter: alpha(opacity=50);'></div>");
    iframe = $("<iframe name='Overlay' style='position:absolute; height:80%; width:80%; top:10%; left:10%;' src='" + url + "'></iframe>");
    closebut = $("<img style='position:absolute; cursor:pointer; right:10%; top:10%;' width='24px' height='24px' src='/images/close.png' onclick='RemovePopup()' >");
    overlay.append(iframe).append(closebut);
    $('body').prepend(overlay);
}
function RemovePopup() {
    overlay.animate({top:'100%'},800,'swing', function() { $(this).remove(); });
}
</script>
</div></body></html>

Here is the complete content of test1.html: <html><head></head><body><input></body></html>

So create these 2 files, open sample.htm in IE8, click the link to open the popup, type something in the textbox there, close the popup, try and type in the first textbox. If you can, repeat 2 or 3 times.
Eventually the first textbox becomes disabled.

Can anyone suggest a workaround?

Thanks for any help

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Essentially I think this is a focus problem. If you can get the browser into the situation where the <input> seems disabled then you can actually Tab to the <input> and enter a value as expected.

    I believe the $(this).remove(); call to remove the iframe at the end of the animation is causing the problem when an element in the iframe has focus. I’d suggest giving the first <input> focus before removing the iframe.

    For example, use $('input:first').focus(); if it is the first input. It seems to work in my testing here.

    • 0