Skip to content

Instantly share code, notes, and snippets.

@codefactor
Created May 10, 2011 22:13
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save codefactor/965487 to your computer and use it in GitHub Desktop.
Save codefactor/965487 to your computer and use it in GitHub Desktop.
StyleSheet utility problem inside IE <= 7
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Stylesheet Testing</title>
<script src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js" charset="utf-8"></script>
<script type="text/javascript">
YUI().use("event", "stylesheet", function(Y){
var stylesheet = new Y.StyleSheet();
var toggletSet = true;
Y.on("click", function() {
if (toggletSet) {
stylesheet.set('.myclass', {display: 'none'});
} else {
stylesheet.unset('.myclass', 'display');
}
toggletSet = !toggletSet;
}, "#toggle");
var html = [
'<table><tr><td>',
'<div style="overflow: auto; width: 200px; height: 60px;">',
'<span class="myclass">Text reappears <input value="but inputs do not"></span>',
'</div>',
'</td></tr></table>'
];
Y.one('#content_panel').setContent(html.join(''));
Y.one('#toggle').set('disabled', false);
});
</script>
</head>
<body>
<div id="content_panel"></div>
<button id="toggle" disabled="disabled">toggle</button>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment