Hallo gerdi,
ich bin gerade am Testen von tabcontrol. Die reiter werden bei mir als Liste angezeigt. Wie bekomme ich es hin, dass es Reiter werden?
Indem Du das Template anpasst:
Code:
<!-- indexer::stop -->
<script type="text/javascript">
<!--//--><![CDATA[//><!--
function loadTabControls() {
$$('div.mod_article').each(function(el, idx) {
var xcookieBase = el.id ? 'tabcontrol_' + el.id : 'tabcontrol_x' + idx;
var xtabs = el.getElements('<?php echo $this->tabsSelector; ?>');
var xpanes = el.getElements('<?php echo $this->panesSelector; ?>');
var xinitialTab = '';
if (Cookie.read(xcookieBase) && !isNaN(parseInt(Cookie.read(xcookieBase)))) {
var initialIndex = parseInt(Cookie.read(xcookieBase));
if (initialIndex >= 0 && initialIndex < xpanes.length && initialIndex < xtabs.length) {
// give precendence to anchor
var anchoredPane = $(location.hash.substr(1));
if (anchoredPane) {
xpanes.each(function(pane, index) {
if (anchoredPane === pane) {
initialIndex = index;
}
});
}
xinitialTab = xtabs[initialIndex];
}
}
new TabControl(el,
{
cookieBase: xcookieBase,
initialTab: xinitialTab,
behaviour: '<?php echo $this->behaviour; ?>',
tabs: xtabs,
panes: xpanes,
selectedClass: 'selected',
hoverClass: 'hover',
onChange: function(pane, tab) {
// remember open tab
Cookie.write(this.options.cookieBase, this.panes.indexOf(pane));
// kill/set hash mark (for a working back button)
// location.hash = pane.id ? '#' + pane.id : '#x';
location.hash = '';
}
});
});
}
window.addEvent('domready', loadTabControls);
//--><!]]>
</script>
<!-- indexer::continue -->
<div class="<?php echo $this->class; ?>_tabs block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
<ul>
<?php foreach ($this->titles as $title) : ?>
<li class="<?php echo $this->tabs; ?>"><?php echo $title; ?></li>
<?php endforeach; ?>
</ul>
</div>
Und es per CSS Stylest:
Code:
/* ---------------- Style TabControl --------------- */
.ce_tabcontrol_tabs ul li
{
float:left;
display:block;
margin-right:3px;
margin-left:3px;
padding:8px 10px 8px 6px;
text-align:center;
background-color:#e6e6e6;
font-size:12px;
color:#666699;
list-style-type:none;
-moz-border-radius:7px 7px 0 0;
-webkit-border-radius:7px 7px 0 0;
border-radius:7px 7px 0 0;
behavior: url(PIE.htc);
}
.ce_tabcontrol_tabs ul li.selected
{
padding:8px 10px 8px 6px;
font-size:12px;
color:#A84204;
}
.tabs
{
font-weight:bold;
}
.hover
{
cursor: pointer;
}
.panes
{
padding-bottom:10px;
background-color:#e6e6e6;
-moz-border-radius:7px;
-webkit-border-radius:7px;
border-radius:7px;
behavior: url(PIE.htc);
}
Viele Grüße
MiTsch
Zitat von zonky
Dann noch viel Spaß und tolles Wetter!
Zitieren
Lesezeichen