Why is it that my JQuery code works well in Chrome and Firefox, but not in IE (version 9). I get a lot of undefined errors when opening my page in IE within the JQuery library code, and my self written code gives the following error: Microsoft runtime error: $ is undefined.
I should also mention that I am making use of a Master page, which references the JQuery as follow:
<script type="text/javascript" src="<%= Page.ResolveUrl("~/Scripts/jquery-1.4.1.min.js")%>"></script>
<script type="text/javascript" src="<%= Page.ResolveUrl("~/Scripts/blend/jquery.blend.js")%>"></script>
<script type="text/javascript" src="<%= Page.ResolveUrl("~/Scripts/ui.core.js")%>"></script>
<script type="text/javascript" src="<%= Page.ResolveUrl("~/Scripts/ui.sortable.js")%>"></script>
<script type="text/javascript" src="<%= Page.ResolveUrl("~/Scripts/ui.dialog.js")%>"></script>
<script type="text/javascript" src="<%= Page.ResolveUrl("~/Scripts/ui.datepicker.js")%>"></script>
<script type="text/javascript" src="<%= Page.ResolveUrl("~/Scripts/effects.js")%>"></script>
And my JQuery as follow:
<script type="text/javascript">
$(document).ready(function () {
$('#CloseButton').click(function () {
$('#myForm').slideUp(1000);
$('#Screen').css('display', 'none');
return false;
});
});
function EnlargeSlide() {
$(document).ready(function () {
$('#Screen').css({ opacity: 0.7, 'width': $(document).width(), 'height': $(document).height() });
$('#myForm').slideDown('2500');
return false;
});
}
I have similar code in another page, which works well in all browsers.
What might be the issue here?