YUI().use("transition", "panel", function(Y) {

var openBtn = Y.one('#openButton'),

panel = new Y.Panel({

srcNode: "#panelContent",

width:330,

xy: [300, -300],

modal:true,

visible:false,

zIndex: 5,

buttons: [

{

value: "Close the panel",

action: function(e) {

e.preventDefault();

hidePanel();

},

section: "footer"

}

],

render:true

}),

bb = panel.get('boundingBox');

openBtn.on('click', function(e) {

showPanel();

});

function showPanel () {

panel.show();

bb.transition({

duration: 0.5,

top:"80px"

});

}

function hidePanel () {

bb.transition({

duration: 0.5,

top:"-300px"

}, function() {

panel.hide();

});

}

});