[TYPO3] Css drop down menu problem
Loek Hilgersom
hilgersom at xs4all.nl
Wed Jun 13 15:52:36 CEST 2007
Sorry, my mistake (I got lost in all the comments and conditions) :-)
Loek
Oliver Rowlands wrote:
> Hi Loek,
>
> Gideon's HTML code is correct and validates, this 'conditional comment'
> technique is used to bypass IE's appalling handling of the :hover CSS
> selector. Have a look at the main navigation on the following site for
> an example:
>
> http://www.spannerworks.com
>
> As far as I can remember it works in IE5.5+, Firefox, Opera, Safari &
> Konqueror without needing any JS.
>
> Gideon, try the following TypoScript:
>
> lib.mainmenu = HMENU
> lib.mainmenu {
> entryLevel = 0
> 1 = TMENU
> 1 {
> wrap = <ul> | </ul>
> noBlur = 1
> expAll = 1
> NO {
> ATagTitle.field = title
> stdWrap.htmlSpecialChars = 1
> ATagBeforeWrap = 1
> linkWrap = | <!--[if IE 7]><!-->
> afterWrap = | <!--<![endif]--><!--[if lte IE
> 6]><table><tr><td><![endif]-->
> wrapItemAndSub = <li> | <!--[if lte IE
> 6]></td></tr></table></a><![endif]--></li>
> }
> ACT < .NO
> ACT = 1
> ACT {
> wrapItemAndSub = <li class="active"> | </li>
> }
> }
> 2 < .1
> }
>
> Hope this helps,
>
> Oliver
>
> Loek Hilgersom wrote:
>> Hi Gideon,
>>
>> To begin with, your desired code doesn't seem to be correct: the
>> second a-tag
>> doesn't get closed for most browsers except IE7 (and for old IE's it
>> gets closed
>> later on).
>> Maybe better correct that first, then I guess it's a matter of
>> diligent work to
>> put all the bits and pieces in the right places in your typoscript. It
>> looks
>> like you're pretty close to a solution.
>>
>> Loek
>>
>>
>> Gideon So wrote:
>>> Hi all,
>>>
>>> I woould like to make a css drop down menu like the following:
>>>
>>> <ul><li><a href="#">Home</a></li> </ul>
>>>
>>> <ul> <li><a href="#">Drop-down 1<!--[if IE
>>> 7]><!--></a><!--<![endif]--><!--[if lte IE
>>> 6]><table><tr><td><![endif]-->
>>> <ul> <li><a href="#">Sublink 11</a></li>
>>> <li><a href="#">Sublink 12</a></li>
>>> <li><a href="#">Sublink 13</a></li>
>>> <li><a href="#">Sublink 14</a></li>
>>> <li><a href="#">Sublink 15 with a lot of text so that entry
>>> hasseveral lines</a></li> </ul><!--[if lte IE
>>> 6]></td></tr></table></a><![endif]--> </li>
>>> </ul>
>>>
>>> I have my typoscript like the following
>>>
>>> lib.mainmenu = HMENU
>>> lib.mainmenu {
>>> wrap = |
>>> entryLevel = 0
>>> 1 = TMENU
>>> 1 {
>>> wrap = <ul> | </ul>
>>> expAll = 1
>>> NO.ATagTitle.field = subtitle//title
>>> NO.wrapItemAndSub = <li> | </li>
>>>
>>> IFSUB = 1
>>> IFSUB {
>>> ATagTitle.field = subtitle//title
>>> wrapItemAndSub = <li> | </li>
>>> allWrap = | <!--<![endif]-->
>>> linkWrap = |<!--[if IE 7]><!-->
>>> ATagBeforeWrap = 1
>>> }
>>> }
>>> 2 = TMENU
>>> 2 {
>>> wrap = <table><tr><td><ul> | </ul></td></tr></table><!--[if lte IE
>>> 6]></a><![endif]-->
>>> expAll = 1
>>> NO.ATagTitle.field = subtitle//title
>>> NO.wrapItemAndSub = <li> | </li>
>>> IFSUB = 1
>>> IFSUB {
>>> wrapItemAndSub = <li> | </li>
>>> allWrap = | <!--<![endif]-->
>>> linkWrap = |<!--[if IE 7]><!-->
>>> ATagBeforeWrap = 1
>>> ATagParams = class="hide"
>>> }
>>> }
>>> }
>>> }
>>>
>>> But I don't have the desire result menu. Can anybody help??
>>>
>>> P.S the output:
>>>
>>> <ul><li><a href="index.php?id=3">home</a></li>
>>>
>>> <li><a href="index.php?id=4">Drop-down1 <!--[if IE
>>> 7]><!--></a><!--<![endif]--><table><tr><td>
>>> <ul><li><a href="index.php?id=15">Sublink 11<!--[if IE
>>> 7]><!--></a><!--<![endif]--></li>
>>> <li><a href="index.php?id=22">Sublink 12</a></li>
>>> <li><a href="index.php?id=16">Sublink 13</a></li>
>>> <li><a href="index.php?id=17">Sublink 14</a></li>
>>> <li><a href="index.php?id=23">Sublink
>>> 15</a></li></ul></td></tr></table><!--[if lte IE
>>> 6]></a><![endif]--></li>
>>>
>>> Gideon
>
>
More information about the TYPO3-english
mailing list