YUI: Using a ContextMenu to Close a Tab
Tab One Label
Tab Two Label
Tab Three Label
Tab One Content
Tab Two Content
Tab Three Content
The Code
YAHOO.example.tabs = function() { var myTabs = new YAHOO.widget.TabView('demo'); myTabs.on('contentReady', function() { // ensure Tabs exist before accessing var oContextMenu = new YAHOO.widget.ContextMenu('contextmenu', { trigger: myTabs._contentParent, lazyload: true, itemdata: [ { text: 'Close This Tab' } ] }); oContextMenu.clickEvent.subscribe(function() { //Don't close the last one if (myTabs.get('tabs').length > 1) { var tab = myTabs.get('activeTab'); myTabs.removeTab(tab); } }, this, true); var oContextMenu2 = new YAHOO.widget.ContextMenu('contextmenu2', { trigger: myTabs._tabParent, lazyload: true, itemdata: [ { text: 'Close This Tab' } ] }); oContextMenu2.clickEvent.subscribe(function(ev, menuEvent, tabInstance) { var tar = menuEvent[1].parent.contextEventTarget; var tabs = myTabs.get('tabs'); if (tabs.length > 1) { for (var i = 0; i < tabs.length; i++) { if (tabs[i].get('element') == tar) { //This is the one we clicked myTabs.removeTab(tabs[i]); break; } } } }, this, true); }); }();