Unobtrusive JavaScript - Test-Driven JavaScript Development - page 194

while (panel && panel.tagName.toLowerCase() != "div") {
panel = panel.parentNode;
}
return panel;
}
/* ... */
}());
Note that getPanel defensively checks its argument and aborts if it doesn't
receive an actual element. This means that we can fearlessly call it using the curr
and prev anchors in the onTabChange method, even though the prev argument
will be undefined the first time it is called.
To make the tabbed panels appear as panels, we can sprinkle on some very
simple CSS, as seen in Listing 9.12.
Listing 9.12 Simple tabbed panel CSS
.js-tabs .section {
clear: left;
display: none;
}
.js-tabs .active-panel {
display: block;
}
.js-tabs .nav {
border-bottom: 1px solid #bbb;
margin: 0 0 6px;
overflow: visible;
padding: 0;
}
.js-tabs .nav li {
display: inline;
list-style: none;
}
.js-tabs .nav a {
background: #eee;
border: 1px solid #bbb;
line-height: 1.6;