public
Created

YUI3 Resize with start event

  • Download Gist
YUI3_resize.html
HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Resize Example</title>
 
<style type="text/css">
#demo {
height: 100px;
width: 100px;
border: 1px solid black;
background-color: #8DD5E7;
position: relative;
padding: 1em;
margin: 2em;
}
</style>
 
<script src="http://yui.yahooapis.com/3.4.0/build/yui/yui-min.js"></script>
 
</head>
 
<body class="yui3-skin-sam ">
 
<div id="demo">Resize Me</div>
 
<script type="text/javascript">
YUI().use('resize', 'resize-plugin', function(Y) {
var resize = new Y.Resize({
//Selector of the node to resize
node: '#demo'
});
resize.plug(Y.Plugin.ResizeConstrained, {
minWidth: 50,
minHeight: 50,
maxWidth: 300,
maxHeight: 300,
preserveRatio: true
});
resize.on('resize:start',function(){ alert('fired resize:start event!');});
});
</script>
</body>
</html>

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.