Toggle


#1

Hi!

I’am using Effect.toggle to show/hide a div field. Is there a simple way
to also toggle the icon i am using. (+ if hidden and - if visible)

<%= link_to_function ‘’,
“Effect.toggle(‘summary_dropdown’)”,
:class => ‘icon-expand’ %>

Thanks.


#2

On 3 Nov 2008, at 14:52, Mikael Björkegren wrote:

Hi!

I’am using Effect.toggle to show/hide a div field. Is there a simple
way
to also toggle the icon i am using. (+ if hidden and - if visible)

I typically do that by also toggling some css class (eg $
(‘something’).toggleClassName(‘expanded’). in this case you can
probably do this.toggleClassName(‘some-class’) )

Fred


#3

Thanks for the quick reply. But where am i going to put this?

I typically do that by also toggling some css class (eg $
(‘something’).toggleClassName(‘expanded’). in this case you can
probably do this.toggleClassName(‘some-class’) )

Fred

<%= link_to_function ‘’,
“Effect.toggle(‘summary_dropdown’)”,
:id => ‘toggle’,
:class => ‘icon-expand’ %>

I guess it should be someting like
(‘toggle’).toggleClassName(‘icon-fade’)

but where will i put this in my link_to_function ?


#4

On 4 Nov 2008, at 09:02, Mikael Björkegren wrote:

“Effect.toggle(‘summary_dropdown’)”,
:id => ‘toggle’,
:class => ‘icon-expand’ %>

I guess it should be someting like
(‘toggle’).toggleClassName(‘icon-fade’)

but where will i put this in my link_to_function ?

the second argument to link_to_function is an arbitrary javascript
fragment. You can put as much in there as you want.

Fred


#5

Frederick C. wrote:

the second argument to link_to_function is an arbitrary javascript
fragment. You can put as much in there as you want.

Fred

To give just a little more detail to what Fred said, you can do
something like

“Effect.toggle(‘this-thing’); Effect.toggle(‘that-thing’);”

Just remember that needs to be proper JavaScript since it’s going to be
eval’d.

Peace.


#6

Got it working thanks for the reply.


#7

I can only get one off them to work at a time. Do anyone know
how to combine the two functions. So the div will fade/appear and
the icon will change from + to -.