[TYPO3-english] Subject: changing wrap for first and last menu items

[David Banning]

Now here is where I may be asking too much. If the first item on the 
menu is a IFSUB then is it possible to also have that as a variation?

Farooq wrote:
> David here I am pasting a typoscript as is from a site of mine where 
> it is working great,
> you may see IFSUB here
>
>
> lib.mainMenu = COA
> lib.mainMenu.10 = HMENU
> lib.mainMenu.10.1 = TMENU
> lib.mainMenu.10.1 {
>     noBlur = 1
>     expAll = 1
>     wrap = <ul id="yacbddm" class="firstLevel"> | </ul>
>   
>   
>     NO.allWrap = <li class="left_con"> | </li> |*| <li 
> class="firstpbt"> | </li> |*| <li class="contact_con"> | </li>
>     IFSUB=1
>     IFSUB {   /// For subpages under that page
>          wrapItemAndSub = <li class="firstPad"> | </li> |*| <li 
> class="firstPad"> | </li> |*| <li class="contact_con">|</li>
>                  
>          ATagParams = class="topmenul1-ifsub"
>     }
>     ACTIFSUB = 1
>     ACTIFSUB {
>       wrapItemAndSub =  <li class="active"> | </li>   /// active class 
> here
>   
>
>           ATagParams = class="topmenul1-ifsub"
>          }
>    
>     }
>      
>    
>
>    
>    
> }
>
> # First dropdown Menu configuration
> lib.mainMenu.10.2 = TMENU
> lib.mainMenu.10.2 {
>     noBlur = 1
>     expAll = 1
>     wrap = <ul class="topmenul2"> | </ul>
>     NO.wrapItemAndSub = <li> | </li>
>     IFSUB=1
>     IFSUB {
>         wrapItemAndSub = <li> | </li>
>         #ATagParams = class="topmenul2-ifsub"
>       
>     }
> }
> # Second dropdown is the same is first drop down
> lib.mainMenu.10.3 < lib.mainMenu.10.2
> lib.mainMenu.10.3.wrap = <ul class="topmenul3"> | </ul>
>
> # Third dropdown is the same is first drop down
> lib.mainMenu.10.4 < lib.mainMenu.10.2
> lib.mainMenu.10.4.wrap = <ul class="topmenul4"> | </ul>
>
> lib.mainMenu.20 = TEXT
> lib.mainMenu.20.value (
>    <script src="fileadmin/js/yacbddm.js" type="text/javascript"></script>
>    <script type="text/javascript">/*activateMenu('yacbddm')*/</script>
> )
>
> ###############Moreover a javascript must be included on page so as to 
> hide and show the sub menu on hovering over a main menu item and its 
> subpages show up ##########
>
>
> ##############Javascript starts here###############
>
>
> function activateA(cur) {
>     var t = cur;
>     if (t) {
>         t=t.firstChild;
>         if (t) {
>             var pos = t.className.indexOf('firstlevellink');
>             if (pos>=0) {
>                 t.className += ' hoveratag';
>             }
>         }
>     }
> }
>
> function deActivateA(cur) {
>     var t = cur;
>     if (t) {
>         t=t.firstChild;
>         if (t) {
>             var pos = t.className.indexOf('firstlevellink');
>             if (pos>=0) {
>                 t.className=t.className.replace(" hoveratag", "");
>             }
>         }
>     }
> }
>
> // IE only makes :hover work on LI tags
> activateMenu = function(nav) {
>     /* Get all the list items within the menu */
>     var navroot = document.getElementById(nav);
>     var lis=navroot.getElementsByTagName("LI"); 
>     for (i=0; i<lis.length; i++) {
>         /* If the LI has another menu level */
>         if(lis[i].lastChild.tagName=="UL"){
>             /* assign the function to the LI */
>             lis[i].onmouseover=function() {       
>                 /* display the inner menu */
>                 this.lastChild.style.display="block";
>                 activateA(this);
>             }
>             lis[i].onmouseout=function() {                      
>                 this.lastChild.style.display="none";
>                 deActivateA(this);
>             }
>         }
>     }
> }
>
> window.onload= function(){
>     /* pass the function the id of the top level UL */
>     /* remove one, when only using one menu */
>     activateMenu('yacbddm');
> }
>
>
> ##############Javascript ends here###############
> just put this JS in a file, name it yacbddm.js, and keep it somewhere 
> inside fileadmin/js/yacbddm.js
>
> Include it by using this TYPOscript on root page of tree
> page,includeJS{
> file1 = fiadmin/js/yacbddm.js
> }
>
> Apply the above said typoscript exactly and a fine menu will start 
> appearing, then you only need to write css to manage its visibility
>
>
>
> On Thu, May 14, 2009 at 8:55 AM, David Banning <david at skytracker.ca 
> <mailto:david at skytracker.ca>> wrote:
>
>     >    You need to wrap your menu this way to give different classes
>     to first
>     >    and last li's generated,
>     >    Â
>     >    Â  wrap = <ul id="yacbddm" class="firstLevel"> | </ul>Â Â
>      //Â  this is
>     >    outer UL within which li's will appear
>     >    Â Â Â Â  NO.allWrap = <li class="first"> | </li> |*| <li
>     >    class="normal"> | </li> |*| <li class="last"> | </li>Â Â  //
>     this is
>     >    parttdioning li's into three parts first, last and all
>     in-between as
>     >    normal
>     >    I have not told about what to do when there need be active
>     class or so,
>     >    if more script is needed, say back.
>
>     Yes - Thanks for that Farooq - I did find that in a thread somewhere
>     but ran into problems because of another class. So how is this
>     configuration
>     handled in operation with ACT, CUR or IFSUB?
>
>
>
>
> -- 
> Regards,
> Farooq