1
demian
Mytabs module - change tabs position from top to bottom ?
  • 2010/1/30 16:35

  • demian

  • Quite a regular

  • Posts: 225

  • Since: 2008/4/29


is it possible in mytabs, i want the tabs position to be in the bottom instead at top?

i want to have it something like this
http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm

Here's the code for the mytabsdefault class css..what do i need to change ?

.mytabsdefault-menu{
    
width: 100%;
    
padding: 0;
    
background: transparent;
    
voice-family: ""}"";
    
voice-family: inherit;
}

.
mytabsdefault-menu ul{
    
margin:0 !important;
    
padding: 0 !important;
    list-
style: none;
}

.
mytabsdefault-menu li{
    
display: inline;
    
padding: 0 !important;
}

.
mytabsdefault-menu a{
    
float: left;
    
display: block;
    
text-decoration: none;
    
margin: 0 2px 0 0 !important; /*Margin between each menu item*/
    
padding: 10px 15px 11px 15px !important;
    
background-color: #C6C7C9 !important;
    
font-weight: bold;
    
border-bottom: 1px solid #ADB0B7;
}

.
mytabsdefault-menu a:hover{
    
background-color: #F1F1F1 !important;
    
border-bottom: 1px solid #F1F1F1;
    
border-top: 1px solid #ADB0B7;
}

.
mytabsdefault-menu a.tabs-selected{ /*currently selected tab*/
    
background-color: #F1F1F1 !important;
    
border-bottom: 1px solid #F1F1F1;
    
border-top: 1px solid #ADB0B7;
}

.
mytabsdefault-content{
    
display: none;
    
background: #fff url(mytabs_bg.jpg) top repeat-x;
    
margin: 0px;
    
padding: 0px;
}

.
mytabsdefault-block{
    
padding: 10px;
}

.
mytabsdefault-blocktitle{
    
margin-top: 0px;
}

.
mytabsdefault-blockcontent{
    
padding: 0px;
    
text-align: justify;
}

@
media print {
    .
mytabsdefault-content {
        
display:block !important;
    }
}

2
demian
Re: Mytabs module - change tabs position from top to bottom ?
  • 2010/2/14 2:51

  • demian

  • Quite a regular

  • Posts: 225

  • Since: 2008/4/29


ok finally successfuly implemented this in my website

what i did was create new block defintions in xoops_version.php and create a new template for it



$modversion['blocks'][2]['file'] = "mytabs_block.php";
$modversion['blocks'][2]['name'] = "My Tabs Block (Down)";
$modversion['blocks'][2]['description'] = "Shows dynamic content tab";
$modversion['blocks'][2]['show_func'] = "b_mytabs_block_show";
$modversion['blocks'][2]['edit_func'] = "b_mytabs_block_edit";
$modversion['blocks'][2]['options'] = "|0|400|mytabsdefault|true|2000||1|0|false";
$modversion['blocks'][2]['template'] = 'mytabs_block_blocks_down.html';


new template -templates/blocks/mytabs_block_blocks_down.html
<div class="<{$block.class}>-menu" id="tabscontents-<{$block.uniqueid}>"><{$block.tabsmenu}></div>

<{foreach 
item=thistab from=$block.tabs}>
  <
div class="<{$block.class}>-content" id="tab-<{$thistab.id}>-<{$block.uniqueid}>" style="<{if $block.width != 0}>width:<{$block.width}>px;<{/if}><{if $block.height != 0}>height: <{$block.height}>px;<{/if}>overflow: auto;">
    <
table cellspacing="0">
      <
tr>
      <{foreach 
item=placement from=$block.placements}>
        <{if 
$thistab.$placement}>
          <
td style="width:<{$thistab.width}>%; padding: 5px; vertical-align: top;">
            <{foreach 
item=thisblock from=$thistab.$placement}>
              <
div class="<{$block.class}>-block">
                <{if 
$block.showblockstitle == 1}>
                  <
h2 class="<{$block.class}>-blocktitle"><{$thisblock.title}></h2>
                <{/if}>
                <
div class="<{$block.class}>-blockcontent"><{$thisblock.content}></div>
              </
div>
            <{/foreach}>
          </
td>
        <{/if}>
      <{/foreach}>
      </
tr>
    </
table>
  </
div>
<{/foreach}>

<
script type="text/javascript">
var 
tabc_<{$block.uniqueid}>=new ddtabcontent("tabscontents-<{$block.uniqueid}>")
tabc_<{$block.uniqueid}>.setpersist(<{$block.persist}>)
tabc_<{$block.uniqueid}>.hidetabs(<{$block.hidetabs}>)
tabc_<{$block.uniqueid}>.setonmouseover(<{$block.onmouseover}>)
tabc_<{$block.uniqueid}>.setselectedClassTarget("link")
tabc_<{$block.uniqueid}>.init(<{$block.milisec}>)
</
script>