TYPO3 Mailingliste: nicht fragen - lesen!

Hi,

I'm trying to create a TMENU where the BGcolor has to be different on
each item when it is active. It work with NO and ACT, but I would like
to have a RO-effect too.

Is that possible?

My code until now:

################################################## ##########
# Menu objects:
temp.menu1 = HMENU
temp.menu1.1 = TMENU
temp.menu1.1 {
expAll = 1
NO {
allWrap.insertData=1
allWrap = <div class="menu"> | <br />
ATagParams = onmouseover="changecolor(this, '{$pageColor}');"
onmouseout="changecolor(this, '{$menuBGColor}');"
wrapItemAndSub = | </div>
}

ACT < .NO
ACT = 1
ACT {
allWrap.insertData=1
allWrap = <div class="menuACT{field:uid}"> | <br />
wrapItemAndSub = | </div>
}
}


temp.menu1.2 = TMENU
temp.menu1.2 {
NO {
allWrap = | <br />
}
}
################################################## ##########

And then there are some CSS to change the colors. Example:
###################
div.menuACT8 {
width: 100%;
background: #ec008c;
margin-bottom: 3px;
}
###################

Regard
Anders Kongsted


_______________________________________________
TYPO3-english mailing list
TYPO3-english (AT) lists (DOT) netfielders.de
http://lists.netfielders.de/cgi-bin/.../typo3-english

Hi Anders,

Anders Kongsted wrote:
> I'm trying to create a TMENU where the BGcolor has to be different on
> each item when it is active. It work with NO and ACT, but I would like
> to have a RO-effect too.
>
> Is that possible?

For sure. I see 2 relatively simple ways to achive this:

1) use ACTRO (which generates some JS, I think, never used that myself)

compare
http://typo3.org/documentation/docum...1.0/view/10/2/

2) simply use CSS

As I see you are using TMENU and CSS anyway (and I'm a CSS guy), I'll
suggest that way, see below

> My code until now:
>
> ################################################## ##########
> # Menu objects:
> temp.menu1 = HMENU
> temp.menu1.1 = TMENU
> temp.menu1.1 {
> expAll = 1
> NO {
> allWrap.insertData=1
> allWrap = <div class="menu"> | <br />
> ATagParams = onmouseover="changecolor(this, '{$pageColor}');"
> onmouseout="changecolor(this, '{$menuBGColor}');"

I don't think this ATagParams line is neccessary. If you would use
ACTRO, TYPO3 would insert the neccessary JS for you. If you follow the
CSS way I suggest this line isn't needed anyway.

> wrapItemAndSub = | </div>
> }
>
> ACT < .NO
> ACT = 1
> ACT {
> allWrap.insertData=1
> allWrap = <div class="menuACT{field:uid}"> | <br />
> wrapItemAndSub = | </div>
> }
> }
>
>
> temp.menu1.2 = TMENU
> temp.menu1.2 {
> NO {
> allWrap = | <br />
> }
> }
> ################################################## ##########
>
> And then there are some CSS to change the colors. Example:
> ###################
> div.menuACT8 {
> width: 100%;
> background: #ec008c;
> margin-bottom: 3px;
> }
> ###################
>
> Regard
> Anders Kongsted

As you have set up a special class for every of your active menu items a
CSS file snippet similar to this should do the job:

/* Format menu items and their hovers/rollovers */
div.menuACT8 {
background-color: yellow;
}
div.menuACT8:hover {
background-color: orange;
}

div.menuACT9 {
background-color: grey;
}
div.menuACT9:hover {
background-color: green;
}

div.menuACT10 {
background-color: purple;
}
div.menuACT10:hover {
background-color: red;
}


HTH, Georg
--
___ ___
| + | |__ Georg Rehfeld Woltmanstr. 12 20097 Hamburg
|_|_\ |___ georg.rehfeld.nospam (AT) gmx (DOT) de +49 (40) 23 53 27 10

(Delete .nospam from mail address)
_______________________________________________
TYPO3-english mailing list
TYPO3-english (AT) lists (DOT) netfielders.de
http://lists.netfielders.de/cgi-bin/.../typo3-english

> Anders Kongsted wrote:
>> I'm trying to create a TMENU where the BGcolor has to be different on
>> each item when it is active. It work with NO and ACT, but I would
>> like to have a RO-effect too.
>>
>> Is that possible?
>
> For sure. I see 2 relatively simple ways to achive this:
>
> 1) use ACTRO (which generates some JS, I think, never used that
> myself)

Doesn't exist in TMENU, since this is a GMENU item state.

> compare
>
http://typo3.org/documentation/docum...1.0/view/10/2/
>
> 2) simply use CSS

+1

Joey

--
Wenn man keine Ahnung hat: Einfach mal Fresse halten!
(If you have no clues: simply shut your gob sometimes!)
Dieter Nuhr, German comedian
openBC/Xing: http://www.cybercraft.de
T3 cookbook: http://www.typo3experts.com


_______________________________________________
TYPO3-english mailing list
TYPO3-english (AT) lists (DOT) netfielders.de
http://lists.netfielders.de/cgi-bin/.../typo3-english

Hi,

Thanks! I didn't know that I could use hover on table's.... :|

But anyway, thanks... I used the CSS-way..... )

//Anders

Georg Rehfeld skrev:
> Hi Anders,
>
> Anders Kongsted wrote:
>> I'm trying to create a TMENU where the BGcolor has to be different on
>> each item when it is active. It work with NO and ACT, but I would like
>> to have a RO-effect too.
>>
>> Is that possible?
>
> For sure. I see 2 relatively simple ways to achive this:
>
> 1) use ACTRO (which generates some JS, I think, never used that myself)
>
> compare
> http://typo3.org/documentation/docum...1.0/view/10/2/
>
>
> 2) simply use CSS
>
> As I see you are using TMENU and CSS anyway (and I'm a CSS guy), I'll
> suggest that way, see below
>
>> My code until now:
>>
>> ################################################## ##########
>> # Menu objects:
>> temp.menu1 = HMENU
>> temp.menu1.1 = TMENU
>> temp.menu1.1 {
>> expAll = 1
>> NO {
>> allWrap.insertData=1
>> allWrap = <div class="menu"> | <br />
>> ATagParams = onmouseover="changecolor(this, '{$pageColor}');"
>> onmouseout="changecolor(this, '{$menuBGColor}');"
>
> I don't think this ATagParams line is neccessary. If you would use
> ACTRO, TYPO3 would insert the neccessary JS for you. If you follow the
> CSS way I suggest this line isn't needed anyway.
>
>> wrapItemAndSub = | </div>
>> }
>>
>> ACT < .NO
>> ACT = 1
>> ACT {
>> allWrap.insertData=1
>> allWrap = <div class="menuACT{field:uid}"> | <br />
>> wrapItemAndSub = | </div>
>> }
>> }
>>
>>
>> temp.menu1.2 = TMENU
>> temp.menu1.2 {
>> NO {
>> allWrap = | <br />
>> }
>> }
>> ################################################## ##########
>>
>> And then there are some CSS to change the colors. Example:
>> ###################
>> div.menuACT8 {
>> width: 100%;
>> background: #ec008c;
>> margin-bottom: 3px;
>> }
>> ###################
>>
>> Regard
>> Anders Kongsted
>
> As you have set up a special class for every of your active menu items a
> CSS file snippet similar to this should do the job:
>
> /* Format menu items and their hovers/rollovers */
> div.menuACT8 {
> background-color: yellow;
> }
> div.menuACT8:hover {
> background-color: orange;
> }
>
> div.menuACT9 {
> background-color: grey;
> }
> div.menuACT9:hover {
> background-color: green;
> }
>
> div.menuACT10 {
> background-color: purple;
> }
> div.menuACT10:hover {
> background-color: red;
> }
>
>
> HTH, Georg
_______________________________________________
TYPO3-english mailing list
TYPO3-english (AT) lists (DOT) netfielders.de
http://lists.netfielders.de/cgi-bin/.../typo3-english

Anders Kongsted wrote:
> Hi,
>
> Thanks! I didn't know that I could use hover on table's.... :|

doesn't work in ie (only for <a>)

>
> But anyway, thanks... I used the CSS-way..... )
>
> //Anders
>
> Georg Rehfeld skrev:
>> Hi Anders,
>>
>> Anders Kongsted wrote:
>>> I'm trying to create a TMENU where the BGcolor has to be different on
>>> each item when it is active. It work with NO and ACT, but I would like
>>> to have a RO-effect too.
>>>
>>> Is that possible?
>>
>> For sure. I see 2 relatively simple ways to achive this:
>>
>> 1) use ACTRO (which generates some JS, I think, never used that myself)
>>
>> compare
>> http://typo3.org/documentation/docum...1.0/view/10/2/
>>
>>
>> 2) simply use CSS
>>
>> As I see you are using TMENU and CSS anyway (and I'm a CSS guy), I'll
>> suggest that way, see below
>>
>>> My code until now:
>>>
>>> ################################################## ##########
>>> # Menu objects:
>>> temp.menu1 = HMENU
>>> temp.menu1.1 = TMENU
>>> temp.menu1.1 {
>>> expAll = 1
>>> NO {
>>> allWrap.insertData=1
>>> allWrap = <div class="menu"> | <br />
>>> ATagParams = onmouseover="changecolor(this, '{$pageColor}');"
>>> onmouseout="changecolor(this, '{$menuBGColor}');"
>>
>> I don't think this ATagParams line is neccessary. If you would use
>> ACTRO, TYPO3 would insert the neccessary JS for you. If you follow the
>> CSS way I suggest this line isn't needed anyway.
>>
>>> wrapItemAndSub = | </div>
>>> }
>>>
>>> ACT < .NO
>>> ACT = 1
>>> ACT {
>>> allWrap.insertData=1
>>> allWrap = <div class="menuACT{field:uid}"> | <br />
>>> wrapItemAndSub = | </div>
>>> }
>>> }
>>>
>>>
>>> temp.menu1.2 = TMENU
>>> temp.menu1.2 {
>>> NO {
>>> allWrap = | <br />
>>> }
>>> }
>>> ################################################## ##########
>>>
>>> And then there are some CSS to change the colors. Example:
>>> ###################
>>> div.menuACT8 {
>>> width: 100%;
>>> background: #ec008c;
>>> margin-bottom: 3px;
>>> }
>>> ###################
>>>
>>> Regard
>>> Anders Kongsted
>>
>> As you have set up a special class for every of your active menu items a
>> CSS file snippet similar to this should do the job:
>>
>> /* Format menu items and their hovers/rollovers */
>> div.menuACT8 {
>> background-color: yellow;
>> }
>> div.menuACT8:hover {
>> background-color: orange;
>> }
>>
>> div.menuACT9 {
>> background-color: grey;
>> }
>> div.menuACT9:hover {
>> background-color: green;
>> }
>>
>> div.menuACT10 {
>> background-color: purple;
>> }
>> div.menuACT10:hover {
>> background-color: red;
>> }
>>
>>
>> HTH, Georg
_______________________________________________
TYPO3-english mailing list
TYPO3-english (AT) lists (DOT) netfielders.de
http://lists.netfielders.de/cgi-bin/.../typo3-english

Hi Anders, Johannes, all

Johannes Künsebeck wrote:
>> Thanks! I didn't know that I could use hover on table's.... :|
>
> doesn't work in ie (only for <a>)

Hey, Anders never mentioned tables ... though, most "good" browsers
support :hover for most elements. And IE 7 does a better job for :hover
than older versions.

The W3C spec however is (sadly) very unspecific, compare
http://www.w3.org/TR/CSS21/selector....pseudo-classes

| CSS doesn't define which elements may be in the above states, ...
| CSS 2.1 doesn't define if the parent of an element that is ':active'
| or ':hover' is also in that state.

And, although this list is not a CSS list, I would like to give the
hint:

even for IE 6/5.5 only supporting a:hover you _can_ do amazing things
by e.g. setting the anchor to "display: block; width: ...". And the <a>
may contain other elements as well, but note, only _inline_ elements, so
for sure you can't embed a table inside. But you may format the inside
elements, typically one or more spans, with "display: block;" too, or
even with "display: table;" etc.

Have a look at
http://schoppe-freiraumplanung.de/Ro...rten.84.0.html

and inspect the HTML source for the popup images inside
<div id="bilder"> : just some <a><span></span></a> tags. And there are
more advanced samples around

regards, Georg
--
___ ___
| + | |__ Georg Rehfeld Woltmanstr. 12 20097 Hamburg
|_|_\ |___ georg.rehfeld.nospam (AT) gmx (DOT) de +49 (40) 23 53 27 10

(Delete .nospam from mail address)
_______________________________________________
TYPO3-english mailing list
TYPO3-english (AT) lists (DOT) netfielders.de
http://lists.netfielders.de/cgi-bin/.../typo3-english

Hi all,

Georg Rehfeld wrote:
> Have a look at
> http://schoppe-freiraumplanung.de/Ro...rten.84.0.html
>
> and inspect the HTML source for the popup images inside
> <div id="bilder"> : just some <a><span></span></a> tags. And there are
> more advanced samples around

Sorry, they started to work on their site and disabled all content
for now, so instead have a look at
http://georg-rehfeld.de/test/typo3/R...er_Garten.html
in case you are interested in the <a><span></span></a> thingy.

regards, Georg
--
___ ___
| + | |__ Georg Rehfeld Woltmanstr. 12 20097 Hamburg
|_|_\ |___ georg.rehfeld.nospam (AT) gmx (DOT) de +49 (40) 23 53 27 10

(Delete .nospam from mail address)
_______________________________________________
TYPO3-english mailing list
TYPO3-english (AT) lists (DOT) netfielders.de
http://lists.netfielders.de/cgi-bin/.../typo3-english