2017-11-09 12 views
0

와 아코디언 메뉴 :TYPO3 8.7.9 - 분할 된 메뉴 라인 나는 다음과 같은 간단한 TypoScript와 아코디언 메뉴를 사용하여 모바일 내비게이션의 경우

lib.testMenu = HMENU 
lib.testMenu { 
    entryLevel = 0 
    wrap = <div id="mobile_menu">|</div> 
    1 = TMENU 
    1 { 
     expAll = 1 
     IFSUB = 1 
     IFSUB { 
     wrapItemAndSub = <li class="has-sub">|</li> 
    } 

    wrap = <ul>|</ul> 
    NO.wrapItemAndSub = <li>|</li> 
    } 

    2 < .1 
    3 < .1 
    3 { 
    IFSUB { 
     wrapItemAndSub = <li class="has-sub">|</li> 
    } 
    } 
    4 < .3 
} 

처음 두 수준은 보통 헤드 라인을 가지고있다. 'has-sub'클래스를 사용하면 jquery를 사용하여 다음 단계를 열 수 있습니다. 3, 4 단계에는 내용이 있습니다. 따라서 각 레벨의 웹 페이지에 대한 링크와 그 아래의 레벨을 여는 링크가 포함 된 메뉴 라인이 필요합니다. 다음과 같이 표시되어야합니다 :

'현재 계층 링크 | 화살표 '(아래의 레이어를 열려면 링크)'

<li>link-of-the-current-level</li> 
    <li class="has-sub">' Arrow' (link to open the layer below)' ><ul><li> (...)</li><> (...)</li></ul></li> 

더 낮은 수준이없는 경우가 많은 시도에도 불구하고 더

<li class="has-sub"> (...)</li>. 

, 나는 불행하게도 솔루션에 가까이 오지 않은 일 때문에 내가 어떤 힌트에 대해 기쁘게 생각한다. 내가 제대로 이해 한 경우

답변

1

, 최종 결과는 다음과 같아야합니다

<li> 
    <a href="">Title of the page</a> 
</li> 
<li class="has-sub"> 
    'Arrow' 
    <ul> 
     <li> (...)</li> 
     <li> (...)</li> 
    </ul> 
</li> 

내가 맞죠?

나는 그것이 있어야한다고 생각 : 아마

lib.mainmenu = HMENU 
lib.mainmenu { 
    entryLevel = 0 
    wrap = <div id="mobile_menu">|</div> 
    1 = TMENU 
    1 { 
     wrap = <ul>|</ul> 
     expAll = 1 
     NO.wrapItemAndSub = <li class="first">|</li>  
     IFSUB = 1 
     IFSUB { 
      wrapItemAndSub = <li class="first has-sub">|</li> 
     } 
    } 

    2 < .1 
    2.NO.wrapItemAndSub = <li class="second">|</li> 
    2.IFSUB.wrapItemAndSub = <li class="second has-sub">|</li> 
    3 < .1 
    3.NO.wrapItemAndSub = <li class="third">|</li> 
    3 { 
    IFSUB { 

     wrapItemAndSub = <li class="third hasarrow">|</li> 
     allWrap = |</li><li class="third has-sub">'Arrow' 
    } 
    } 
    4 < .3 
    4.NO.wrapItemAndSub = <li class="fourth">|</li> 
    4.IFSUB.wrapItemAndSub = <li class="fourth hassub">|</li> 
    4.IFSUB.allWrap = | 
} 

하지 난 그냥 더 나은 위해 좀 더 클래스를 추가 한 일부 TypoScript 전문가가 더 잘 할 수 있다는 :)

를 추측 :) 깨끗한 솔루션 내가 인쇄하고있는 수준에 대한 이해. 내가 그것을 정확하게 이해했는지 그리고이 것이 당신에게 효과가 있는지 알려주세요.

+0

빠른 반응을 가져 주셔서 감사합니다. 생성 된 HTML은 멋지게 보이며 내가 필요로하는 것은 excatly합니다. 하지만 저는 아코디언을위한 jquery가있는 프롤렘을 가지고 있습니다. 그래서 더 많은 테스트를해야합니다. – Robert

+0

몇 가지 테스트를 마친 후에는 문제가 없습니다. 다시 한 번 감사드립니다. – Robert