earwig75
asked on
jQuery menu problem in an older browser
I need the below code to work in IE 11 with compatibility mode turned on. Basically the problem is, <li> items with a <ul> below them do not show up on the page, they show up as white text on white. Examples from the menu below that don't work properly are "Jazz" "Rock" and "Pop". I tried messing around with the css, but I am not having any luck. Can someone assist?
<html lang="en">
<head>
<title>jQuery UI Menu - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
$( "#menu" ).menu();
} );
</script>
<style>
.ui-menu { width: 150px; }
</style>
</head>
<body>
<ul id="menu">
<li class="ui-state-disabled"><div>Toys (n/a)</div></li>
<li><div>Books</div></li>
<li><div>Clothing</div></li>
<li><div>Electronics</div>
<ul>
<li class="ui-state-disabled"><div>Home Entertainment</div></li>
<li><div>Car Hifi</div></li>
<li><div>Utilities</div></li>
</ul>
</li>
<li><div>Movies</div></li>
<li><div>Music</div>
<ul>
<li><div>Rock</div>
<ul>
<li><div>Alternative</div></li>
<li><div>Classic</div></li>
</ul>
</li>
<li><div>Jazz</div>
<ul>
<li><div>Freejazz</div></li>
<li><div>Big Band</div></li>
<li><div>Modern</div></li>
</ul>
</li>
<li><div>Pop</div></li>
</ul>
</li>
<li class="ui-state-disabled"><div>Specials (n/a)</div></li>
</ul>
</body>
</html>
Welcome to real life Member_2_7969240
It is only when you sit at home and write HTML for your friends you have told your site only supports latest Chrome that you can get away with not supporting legacy. In the real world, the CIO's cousin on IE8 can be the ONLY reason to be told to support it and MANY if not ALL corporate environments may have a roll out time of years and years since their homegrown software is not compatible with newer versions of certain browsers.
It is only when you sit at home and write HTML for your friends you have told your site only supports latest Chrome that you can get away with not supporting legacy. In the real world, the CIO's cousin on IE8 can be the ONLY reason to be told to support it and MANY if not ALL corporate environments may have a roll out time of years and years since their homegrown software is not compatible with newer versions of certain browsers.
@earwig75 - Your page validates at w3org if I add a
Also note your have https:// on all but the css file - that will make it fail from file protocol
<!DOCTYPE html>
Also note your have https:// on all but the css file - that will make it fail from file protocol
ASKER
Thank you for the replies. Yes, I work in a corporate environment and we have to support old browsers in compatibility mode.
I cannot test your page until tomorrow since I do not have MS at home and it is 1st of May and a corporate holiday ;)
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
There is no reason to be supporting legacy browsers unless you are in a controlled environment in which case why bother using modern technologies?