I am making a responsive twitter bootstrap template for joomla 2.5/3.x versions.
But problem is implementing top menu of joomla. I have a menu in joomla, with some menu items has sub menu items, so when mouse is placed on any item, those sub menu items will be shown normally.
I've tried this code in my template -
<div class="navbar navbar-fixed">
<div class="navbar-inner">
<div class="container<?php echo $template_width; ?>">
<?php if($this->countModules('top-nav')) : ?>
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<?php endif; ?>
<?php echo $custom_logo; ?>
<?php if($this->countModules('top-nav')) : ?>
<div class="nav-collapse">
<jdoc:include type="modules" name="top-nav" style="none" />
</div>
<?php endif; ?>
</div>
</div>
</div>
As you see, when I place my joomla menu from module manager to "top-nav" position, that menu will be displayed at top of template.
But it does show menu as well as sub menu items for some menu items, which is not expected as I want those sub menu items of main menu item will be hidden and will be displayed on mouse over. I saw in bootstrap tutorials this way things works well but not in my case.
So please help with examples to make navigation menu work. Also I used bootstrap 2.3.2 version as latest bootstrap 3.0.0 version even does not show menu.
Also my another concern is joomla 3.x already have bootstrap, so it looks like I will have to include only those existing instead of the way I include bootstrap in joomla 2.5 versions.
In this case how do I ensure compatibility of my template for both joomla 2.5 and 3 versions? as in template I using bootstrap 2.3.2 version for joomla 2.5 versions.