Skip to content

Instantly share code, notes, and snippets.

@sgilligan

sgilligan/overlayDefect.htm

Created August 25, 2011 13:54
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 sgilligan/1170711 to your computer and use it in GitHub Desktop.
Save sgilligan/1170711 to your computer and use it in GitHub Desktop.
Download ZIP
Centered overlay _syncPosUIAlign not centering correctly
Raw
overlayDefect.htm
<!DOCTYPE html>
<html>
<head>
<title>Widget Center test</title>
<style type="text/css">
.yui3-js-enabled .yui3-overlay-loading {top:-1000em; left:-1000em; position:absolute; }
.yui3-overlay-content {background-color:#ccc; border:1px solid #000; padding:5px; }
.yui3-overlay .yui3-widget-hd, .yui3-overlay .yui3-widget-bd, .yui3-overlay .yui3-widget-ft { background-color:#eee; padding:2px; border:1px solid #999;}
.yui3-overlay .yui3-widget-bd { background-color:#fff;}
</style>
</head>
<body class="yui3-skin-sam">
<h1>Widget Center and _syncUIPosAlign() test</h2>
<div id="overlay" class="yui3-overlay-loading">
<div class="yui3-widget-hd">Overlay Header</div>
<div class="yui3-widget-bd">Overlay Body</div>
<div class="yui3-widget-ft">Overlay Footer</div>
</div>
<button type="button" id="show">Show</button>
<button type="button" id="hide">Hide</button>
<script src="http://yui.yahooapis.com/3.4.0/build/yui/yui.js"></script>
<script>
YUI({filter:'raw'}).use('overlay', function(Y){
var overlay = new Y.Overlay({
srcNode: "#overlay",
width: "800px",
height: "100px",
visible: false,
centered: true,
constrain: true,
render: true,
visible: false
});
overlay.get('boundingBox').setStyle('transform','scale(0.8)');
overlay.render();
Y.on("click", function() {
overlay._syncUIPosAlign();
overlay.show();
}, "#show");
Y.on("click", function() {overlay.hide()}, "#hide");
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment