Hallo Zusammen,
ich verwende erstmalig für eine Seite dass Bootstrap - allerdings nicht die EXT sondern "zu Fuss" eingebunden 😃
Das ganze lässt sich wunderbar am PC bedienen - jedoch kann ich die Submenüpunkte weder am iPad noch auf einem Smartphone richtig anklicken...beim Touch geht das Submenü wieder zu und nix passiert?! :o:o
Der Link zur Seite: www.fmc-gablingen.de
Vielleicht kann mir dabei jemand helfen?
Vielen vielen Dank schon mal
Folgendes TS:
menu.top = HMENU
menu.top {
#includeNotInMenu = 0
# Create a menu out of the pages specifically listed under special.value
special = directory
special.value = {$menu.top.pages}
1 = TMENU
1 {
expAll = 1
NO.allWrap = <li>|</li>
NO.ATagTitle.field = abstract // description // title
ACT = 1
ACT.wrapItemAndSub = <li>|</li>
ACT.ATagTitle.field = abstract // description // title
IFSUB = 1
IFSUB.before = <a href="#" class="dropdown-toggle" data-toggle="dropdown">
IFSUB.after = <b class="caret"></b></a>
IFSUB.doNotLinkIt = 1
IFSUB.wrapItemAndSub = <li class="dropdown">|</li>
IFSUB.ATagTitle.field = abstract // description // title
ACTIFSUB = 0
ACTIFSUB.before = <a href="#" class="dropdown-toggle" data-toggle="dropdown">
ACTIFSUB.after = <b class="caret"></b></a>
ACTIFSUB.doNotLinkIt = 1
ACTIFSUB.wrapItemAndSub = <li class="dropdown">|</li>
ACTIFSUB.ATagTitle.field = abstract // description // title
wrap = <ul class="nav">|</ul>
}
2 = TMENU
2 {
expAll = 1
ACT = 1
ACT.wrapItemAndSub = <li>|</li>
ACT.ATagTitle.field = abstract // description // title
ACTIFSUB = 1
ACTIFSUB.wrapItemAndSub = |
ACTIFSUB.before = <li class="divider"></li><li class="nav-header">
ACTIFSUB.after = </li>
ACTIFSUB.doNotLinkIt = 1
ACTIFSUB.ATagTitle.field = abstract // description // title
NO.allWrap = <li>|</li>
NO.ATagTitle.field = abstract // description // title
IFSUB = 1
IFSUB.before = <li class="divider"></li><li class="nav-header">
IFSUB.after = </li>
IFSUB.doNotLinkIt = 1
IFSUB.ATagTitle.field = abstract // description // title
SPC = 1
SPC.allWrap = <li class="divider"></li><li class="nav-header">|</li>
wrap = <ul class="dropdown-menu" role="menu">|</ul>
}
3 = TMENU
3 {
expAll = 1
NO.allWrap = <li>|</li>
NO.ATagTitle.field = abstract // description // title
ACT = 1
ACT.wrapItemAndSub = <li>|</li>
ACT.ATagTitle.field = abstract // description // title
}
}
Das HTML-Template sieht so aus:
<header>
<div id="navbox">
<f:cObject typoscriptObjectPath="lib.logo" />
<div class="navbar navbar-inverse navbar-fixed-top">
<div>
<div>
<button type="button" 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>
</button>
<div class="nav-collapse collapse">
<nav id="nav-top">
<f:cObject typoscriptObjectPath="menu.top" />
</nav>
</div><!--/.nav-collapse -->
</div>
</div>
</div>
</div>
</header>