var t = YAHOO.util.Connect.asyncRequest('GET', url, { success: function(o) { // o.status // o.statusText // o.responseText // o.argument }, failure: function(o) { }, // Passing an array of arguments to both the success and failure callback argument: [argument1, argument2, argument3] }, null /* "new=1&old=2" */ );
YAHOO.util.Event.on(select_id, 'change', opt.onChange ); YAHOO.util.Event.addListener(oElement, "click", fnCallback); YAHOO.util.Event.onDOMReady(init); YAHOO.util.Event.getTarget(e); MyObj.prototype.addClickHandler = function() { YAHOO.util.Event.addListener(this.elementId, "click", this.callback, this); }; // as soon as elemnt is rendered in the DOM YAHOO.util.Event.onAvailable(id, this.handleOnAvailable, this); // in IE, dom manipulation is not possible untill DOM is READY YAHOO.util.Event.onDOMReady(function() { YAHOO.util.Dom.setStyle("hidden_element", "visibility", ""); } );
var el = YAHOO.util.Dom.get('id'); YAHOO.util.Dom.setStyle(['test', 'test2'], 'opacity', 0.5); var opacity = YAHOO.util.Dom.getStyle('test2', 'opacity'); var elements = YAHOO.util.Dom.getElementsByClassName('test', 'div'); var selects = document.getElementsByTagName('select', document.getElementById('html_dimensions')); // class YAHOO.util.Dom.hasClass(element, className); YAHOO.util.Dom.addClass(element, className); YAHOO.util.Dom.removeClass(element, className); YAHOO.util.Dom.replaceClass(element, oldClassName, newClassName);
var panel_one = new YAHOO.widget.Panel("panel_one", { close:true, visible:false, draggable:false } ); panel_one.render();
The draggable property defines whether the panel could be moved via drag and drop or not. Activate Panel Two to see the panel, move it around by dragging the header and click the close button on its top right to get rid of it.
var panel_two = new YAHOO.widget.Panel("panel_two", { close:true, visible:false, draggable:true } ); panel_two.render();
Setting the constraintoviewport property to true makes sure that the panel can never leave the browser window. Activate Panel Three to see the panel, move it around by dragging the header, try to move it outside the browser window and click the close button on its top right to get rid of it.
var panel_three = new YAHOO.widget.Panel("panel_three", { close:true, visible:false, draggable:true, constraintoviewport:true } ); panel_three.render();
context property: defines what element should provide the context for the panel. The value of the property is an array starting with the element's ID (or a variable containing the element object), followed by which corner of the panel (tl, tr, br or bl) should connect with which corner of the context element.
//Set to top left: panel_four.cfg.setProperty('context',['anchorElement', 'br', 'tl']); //Set to bottom right: panel_four.cfg.setProperty('context',['anchorElement', 'tl', 'br']); //Set to bottom left: panel_four.cfg.setProperty('context',['anchorElement', 'tr', 'bl']); var panel_four = new YAHOO.widget.Panel("panel_four", { close:true, visible:false, draggable:true, context:['anchorElement','bl','tr'] } ); panel_four.render();
var panel_five = new YAHOO.widget.Panel("panel_five", { close:true, visible:false, draggable:true, modal:true } ); panel_five.render();
var myAnim = new YAHOO.util.Anim(imgs[0], { width: { to: d['w'] }, height: { to: d['h'] } }, 0.75, YAHOO.util.Easing.backBoth); myAnim.animate();
var panel_six = new YAHOO.widget.Panel("panel_six",{ close:true, visible:false, draggable:true, effect:{effect:YAHOO.widget.ContainerEffect.FADE, duration: 1} } ); panel_six.render();
var panel_seven = new YAHOO.widget.Panel("panel_seven", { close:true, visible:false, draggable:true } ); panel_seven.setHeader('Dynamic!'); panel_seven.setBody('Body'); panel_seven.setFooter('Footer'); panel_seven.render(document.body);