Menu
i have been working on a new .net MVC site and have integrated some of the awesome jquery UI components.
ive been testing it in IE8, FF, opera and Chrome and all looks well. Once I test in IE7, surprisingly its the dialogs that are causing a problem.
basically what’s happening is that one you user clicks to open a dialog the page will scroll immediately to the bottom of the page. This is especially bad if the page is quite long.
this only happens in IE7 (and probably 6 but im not even going there!).
I have spend a few hours reading forums and it seems im not the only one.
I have created a dirty hack which im not keen on but it does work.
onclick="SignIn(); <% if(ModelHelperClass.CheckForOldIEVersion() == true) Response.Write("window.scrollTo(0, 0);"); %> return false;">
has anyone else had this issue and resolved it without resorting to dirty hacks ?
im using jquery-ui-1.8.custom.min.js and jquery-1.4.2.min.js
any help is most appreciated
Truegilly
Update---
hello, thanks for the response -
at the top of my page i have this declaration...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
i am including these files....
<link href="/Scripts/css/blitzer/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/Scripts/jquery-1.4.2.min.js" ></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.1.custom.min.js" ></script>
here is my signin function - the other dialogs are pretty similar
// Sign in to the site
function SignIn()
{
$("#SignIn").dialog({
bgiframe: true,
modal: true,
resizable: false,
buttons: {
'Sign In': function () {
// the username and password
var Username = $("#Username").val();
var Password = $("#Password").val();
var dataString = 'Username=' + Username + '&Password=' + Password;
// AJAX here....
// when the user clicks sign in, the form is submitted
//$("#SignInForm").submit();
},
Cancel: function () {
$(this).dialog('close');
}
}
});
}
as i say, it works fine in all browsers except IE7
762
I had the same issue with IE7 and was using the latest version of jquery and didn't have any stray commas.
The fix turned out to be easy - a simple addition to the CSS. Adding .ui-dialog{ position: absolute; overflow:hidden } fixes it in IE7.
163
Does the dialog use position: fixed? IE7 honors that only when in standards mode, but in quirks mode, it inserts such a dialog in the normal page flow, causing the rest of the page to move down.
Therefore, we should double-check, if you're really in standards mode:
<!doctype html>, because it works very well to put IE7 (and all modern browsers) in standards mode, and it's harder to make a typing mistake.
43
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
