I''ve got a menu in which I have all of my categories as links. Each
category also has subcategories. I want to set it up so when you mouse
over the category the subcategories will pop up (to the right of the
main list, but that''s just CSS). This is what I have so far:
<% for category in @categories %>
<a href="#"
onmouseover="Element.show(''subcategories_<%=category.name%>'')">
<%= link_to category.name, :action => ''category'', :id
=> category %>
<div id="subcategories_<%=category.name%>"
style="display:none">
<div id="indented_categories">
<% for subcategory in category.subcategories %>
<%= link_to subcategory.name, :action => ''category'',
:id =>
subcategory %>
<% end %>
</div></div>
<% end %>
Problems:
Obviously, the subcategories will never dissappear. Is there a
onmouseleave action I could wrap around it?
The pop-up is inconsistent. Not sure about this one. I think it''s
because the <a href ... > isn''t actually part of the link.
Any ideas or thoughts? Anything would be welcome.
Thanks,
Adam
--
Posted via http://www.ruby-forum.com/.
Are you avoiding the simpler use of the CSS :hover pseudo-class for a reason? There are ligit Internet Explorer reasons for avoiding it but a well known workaround for IE exists. On 4/6/06, Adam Bloom <admanb@gmail.com> wrote:> Obviously, the subcategories will never dissappear. Is there a > onmouseleave action I could wrap around it?after the onmouseover attribute use an onmouseout attribute onmouseout="Element.hide(> The pop-up is inconsistent. Not sure about this one. I think it''s > because the <a href ... > isn''t actually part of the link.Inconsistent how? Peter
>> The pop-up is inconsistent. Not sure about this one. I think it''s >> because the <a href ... > isn''t actually part of the link. > > Inconsistent how?It seems to work randomly. When I add the onmouseout part the menu will flash on the screen but never stay. When I change: <%= link_to category.name, :action => ''category'', :id => category %> to some normal html code, it works as expected. Thanks, -Adam -- Posted via http://www.ruby-forum.com/.
On 4/6/06, Adam Bloom <admanb@gmail.com> wrote:> > <%= link_to category.name, :action => ''category'', :id => category %> > > to some normal html code, it works as expected.What is the difference in resulting html between the above link_to and the normal html? Look in the browser "view source". Something must be different there. Peter
With the link_to it looks like this:
<a href="#"
onmouseover="Element.show(''subcategories_Care
management'')"
onmouseout="Element.hide(''subcategories_Care
management'')">
<a href="/providers/category/3">Care management</a>
...
</a>
Without it''s just:
<a href="#"
onmouseover="Element.show(''subcategories_Care
management'')"
onmouseout="Element.hide(''subcategories_Care
management'')">
Test
...
</a>
So the difference is the <a href ...> inside there.
I''m going to take a look at the :hover method. That''s what I
used on the
older version of the site, but we ran into problems with the javascript
workaround for IE (it didn''t work) after I made some small change to
the
CSS.
-Adam
--
Posted via http://www.ruby-forum.com/.
Adam,
<% for category in @categories %>
<a href="#"
onmouseover="Element.show(''subcategories_<%=category.name%>'')">
<%= link_to category.name, :action => ''category'',
:id => category %>
<div id="subcategories_<%=category.name%>"
style="display:none">
<div id="indented_categories">
<% for subcategory in category.subcategories %>
<%= link_to subcategory.name, :action =>
''category'', :id =>
subcategory %>
<% end %>
</div></div>
<% end %>
Are you properly closing the <a href="#" tag with an </a>?
Why do you have two <a> tag''s in the first place? Either change
the
outer one to some other tag.
Or maybe you want to move the onmouseover and onmouse out attributes
into the link_to with is something like this
<%= link_to subcategory.name, {:action =>
''category'', :id =>
subcategory}, {:onmouseover=>''do stuff'',
:onmouseout=>''do other''} %>
BTW, if you are using the outer <a> just to make the cursor look like
a pointer you can do that with css for any element. Set the pointer
attribute.
pointer:cursor;
- Peter
> Are you properly closing the <a href="#" tag with an </a>?I wasn''t, but I fixed that. :)> Or maybe you want to move the onmouseover and onmouse out attributes > into the link_to with is something like this > > <%= link_to subcategory.name, {:action => ''category'', :id > => > subcategory}, {:onmouseover=>''do stuff'', :onmouseout=>''do other''} %>That''s exactly what I want to do. However, I don''t know how to embed the javascript command Element.show in the Ruby tag. >_> I remember I tried this before for a different part of the app, and never figured it out. Sorry for troubling you, and thanks again. -Adam -- Posted via http://www.ruby-forum.com/.
On 4/6/06, Adam Bloom <admanb@gmail.com> wrote:
<%= link_to subcategory.name, {:action => ''category'',
:id> > =>
> > subcategory}, {:onmouseover=>''do stuff'',
:onmouseout=>''do other''} %>
>
> That''s exactly what I want to do. However, I don''t know
how to embed the
> javascript command Element.show in the Ruby tag. >_> I remember I
tried
> this before for a different part of the app, and never figured it out.
i THINK YOU just put it where the do stuff and do other is in my snip
above. look in the link_to documentation.
Peter
> i THINK YOU just put it where the do stuff and do other is in my snip > above. look in the link_to documentation. > > PeterThat''s what I thought too, but I get a syntax error when I try to do a straight copy-paste. Could it be because I''m trying to run JS commands through Rails? -Adam -- Posted via http://www.ruby-forum.com/.
On 4/7/06, Adam Bloom <admanb@gmail.com> wrote:> > i THINK YOU just put it where the do stuff and do other is in my snip > > above. look in the link_to documentation. > > > > Peter > > That''s what I thought too, but I get a syntax error when I try to do a > straight copy-paste.what is the error?
> what is the error?It''s long, but this is the top line: compile error /Users/admanb/listings/public/../config/../app/views/providers/main.rhtml:43: syntax error {:onmouseover => ''Element.show(''subcategories_<%=category.name).to_s); _erbout.concat "'')'', \n" -- Posted via http://www.ruby-forum.com/.
Adam Bloom wrote:> >> what is the error? > > It''s long, but this is the top line: > > compile error > /Users/admanb/listings/public/../config/../app/views/providers/main.rhtml:43: > syntax error > {:onmouseover => > ''Element.show(''subcategories_<%=category.name).to_s); _erbout.concat > "'')'', \n"This is what the code for that looks like: ''Element.show(''subcategories_<%=category.name%>'')'' -- Posted via http://www.ruby-forum.com/.
you can''t have <%%> tags nested. Inside double quotes you can do
can
do something like
<%= .............all the other
stuff............."${category.name}".................more
stuff...%>
you need to use the " and '' pairs correctly. which may mean you
have
to escape some inner double quotes if you need them eg \".
This should make it work.
also in the example you just showed the <%= was not paired correctly with a
%>
Peter
{:onmouseover =>> >
''Element.show(''subcategories_<%=category.name).to_s);
_erbout.concat
On 4/7/06, Adam Bloom <admanb@gmail.com> wrote:> Adam Bloom wrote:
> >
> >> what is the error?
> >
> > It''s long, but this is the top line:
> >
> > compile error
> >
/Users/admanb/listings/public/../config/../app/views/providers/main.rhtml:43:
> > syntax error
> > {:onmouseover =>
> >
''Element.show(''subcategories_<%=category.name).to_s);
_erbout.concat
> > "'')'', \n"
>
> This is what the code for that looks like:
>
>
''Element.show(''subcategories_<%=category.name%>'')''
>
> --
> Posted via http://www.ruby-forum.com/.
> _______________________________________________
> Rails mailing list
> Rails@lists.rubyonrails.org
> http://lists.rubyonrails.org/mailman/listinfo/rails
>
On 4/8/06, Peter Michaux <petermichaux@gmail.com> wrote:> you can''t have <%%> tags nested. Inside double quotes you can do can > do something like > > <%= .............all the other > stuff............."${category.name}".................more stuff...%>Sorry, that dollar sign is a typo. Try> <%= .............all the other > stuff............."#{category.name}".................more stuff...%>Peter