I have implemented the box

wreynolds — Fri, 29 Aug 2008 11:14:17 -0400

I have implemented the box but for some reason i am missing my upper right and left corners and cant seem to resolve. Beginner designer here. Everything else seems to be working fine except for the top corners. Any idea what I have done wrong? Any assistance would be greatly appreciated.

Hi Chris,Thank you for this

humuhumufish — Mon, 16 Jun 2008 14:53:34 -0400

Hi Chris,

Thank you for this post, I learned a lot. I am trying to add a close 'x' function to the tabs but am having a hard time implementing it. I found this code to put on the same page as the tabs, but don't know what do to next.

YAHOO.example.tabs = function() {

var t_counter = 0; // iterator for new tab labels

var myTabs = new YAHOO.widget.TabView('demo');

myTabs.on('contentReady', function() { // ensure Tabs exist before accessing

YAHOO.util.Dom.batch(myTabs.get('tabs'), function(tab) {

YAHOO.util.Event.on(tab.getElementsByClassName('close')[0], 'click', handleClose, tab);

});

YAHOO.util.Event.on('add-tab', 'click', addTab, myTabs, true);

});

var handleClose = function(e, tab) {

YAHOO.util.Event.preventDefault(e);

myTabs.removeTab(tab);

};

function addTab(e) {

YAHOO.util.Event.preventDefault(e);

t_counter++;

var newTab = new YAHOO.widget.Tab({

label: 'New Tab #' + t_counter + '<span class="close">X</span>',

content: 'New tab content for Tab # ' + t_counter + ' goes here.'

});

this.addTab(newTab);

YAHOO.util.Event.on(newTab.getElementsByClassName('close')[0], 'click', handleClose, newTab);

};

}();

YAHOO.util.Event.on(window, 'load', function() { dp.SyntaxHighlighter.HighlightAll('code'); });

</script>

Cheers, Graham

Web Builder Zone - Comments for "How To: Create a Tabbed Box with YUI Tabs"

I have implemented the box

Hi Chris,Thank you for this