Hi, I googled around for more than 5 hours now but still I couldn''t get the solution for my question: How can I change the color of the link as the mouse is rolled over it? Also, change the color of the active link and visited link as I completely hate the default behavior of onmouseover which creates a black box over the link as mouse is rolled on top of a link. An also get rid of the underline in the link. I''m using <%=link_to "Home", :action=>"show_home"%>. Thank you. -- Posted via http://www.ruby-forum.com/.
On Sat, Apr 25, 2009 at 7:00 AM, Jay Pangmi <rails-mailing-list-ARtvInVfO7ksV2N9l4h3zg@public.gmane.org> wrote:> How can I change the color of the link as the > mouse is rolled over it? Also, change the color of the active link and > visited link<http://www.w3.org/TR/CSS21/> HTH, -- Hassan Schroeder ------------------------ hassan.schroeder-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org
Hassan Schroeder wrote:> On Sat, Apr 25, 2009 at 7:00 AM, Jay Pangmi > <rails-mailing-list-ARtvInVfO7ksV2N9l4h3zg@public.gmane.org> wrote: > >> How can I change the color of the link as the >> mouse is rolled over it? Also, change the color of the active link and >> visited link > > <http://www.w3.org/TR/CSS21/> > > HTH, > -- > Hassan Schroeder ------------------------ hassan.schroeder-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.orgThanks for the reply Hassan, I went to the site and did the following: sth.html.erb =================================================================================<div id="side"> <a href = "http://www....." class = "side-link">Home</a><br /> <%= link_to "Products", :action => "show_products", :class => "side-link" %><br /> </div> ================================================================================= sth.css =================================================================================#side a.side-link:link { color: black; } #side a.side-link:visited { color: yellow; } #side a.side-link:hover { color: white; } #side a.side-link:active { color: green; } ================================================================================= Now the problem is, it is only working in the link produced by <a href=......></a> and not in the link produced by <%=link_to "....%>. Also I wanted to get rid of the black box around the link as it gets focus, but couldn''t. For this I tried #side a.side-link:focus {background: none;} but didn''t help. So, any help will be greately appriciated. Thanks -- Posted via http://www.ruby-forum.com/.
On Apr 26, 7:01 am, Jay Pangmi <rails-mailing-l...@andreas-s.net> wrote:> Hassan Schroeder wrote: > > On Sat, Apr 25, 2009 at 7:00 AM, Jay Pangmi > > <rails-mailing-l...@andreas-s.net> wrote: >> =========================================================================== ======> <div id="side"> > <a href = "http://www....." class = "side-link">Home</a><br /> > <%= link_to "Products", :action => "show_products", :class => > "side-link" %><br /> > </div>If you check the generated HTML you'll see that you call to link_to doesn't actually create a link with class side-link: it creates a link whose URL contains ?class=side-link. It's the old "HTML options need to be in a separate options hash" thing. Fred> =========================================================================== ======> > sth.css > =========================================================================== ======> #side a.side-link:link { > color: black; > > } > > #side a.side-link:visited { > color: yellow; > > } > > #side a.side-link:hover { > color: white; > > } > > #side a.side-link:active { > color: green;} > > =========================================================================== ======> > Now the problem is, it is only working in the link produced by <a > href=......></a> and not in the link produced by <%=link_to "....%>. > Also I wanted to get rid of the black box around the link as it gets > focus, but couldn't. For this I tried #side a.side-link:focus > {background: none;} but didn't help. So, any help will be greately > appriciated. Thanks > -- > Posted viahttp://www.ruby-forum.com/.--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk@googlegroups.com To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe@googlegroups.com For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en -~----------~----~----~----~------~----~------~--~---
Frederick Cheung wrote:> On Apr 26, 7:01�am, Jay Pangmi <rails-mailing-l...-ARtvInVfO7ksV2N9l4h3zg@public.gmane.org> > wrote: >> Hassan Schroeder wrote: >> > On Sat, Apr 25, 2009 at 7:00 AM, Jay Pangmi >> > <rails-mailing-l...-ARtvInVfO7ksV2N9l4h3zg@public.gmane.org> wrote: >> > >> =========================================================================== ======>> <div id="side"> >> � <a href = "http://www....." class = "side-link">Home</a><br /> >> � <%= link_to "Products", :action => "show_products", :class => >> "side-link" %><br /> >> </div> > > If you check the generated HTML you''ll see that you call to link_to > doesn''t actually create a link with class side-link: it creates a link > whose URL contains ?class=side-link. It''s the old "HTML options need > to be in a separate options hash" thing. > > FredThanks Fred I figured it out. Now the only problem that persists is when I hover over the links a background with black color appears as the link gets focus and I hate it but couldn''t figure out how I can get rid of it. Thanks -- Posted via http://www.ruby-forum.com/.
Include the following CSS property for all the anchors in your project
a{
outline:none
}
I checked the code in firefox, chrome and IE7. Hope this will work.
If u r using different CSS classes just make sure that any other class
doesnt override this property.
Thank u
On Apr 26, 5:01 pm, Jay Pangmi
<rails-mailing-l...-ARtvInVfO7ksV2N9l4h3zg@public.gmane.org>
wrote:> Frederick Cheung wrote:
> > On Apr 26, 7:01 am, Jay Pangmi
<rails-mailing-l...-ARtvInVfO7ksV2N9l4h3zg@public.gmane.org>
> > wrote:
> >> Hassan Schroeder wrote:
> >> > On Sat, Apr 25, 2009 at 7:00 AM, Jay Pangmi
> >> >
<rails-mailing-l...-ARtvInVfO7ksV2N9l4h3zg@public.gmane.org> wrote:
>
> >>
===========================================================================
======> >> <div id="side">
> >> <a href = "http://www....." class =
"side-link">Home</a><br />
> >> <%= link_to "Products", :action =>
"show_products", :class =>
> >> "side-link" %><br />
> >> </div>
>
> > If you check the generated HTML you''ll see that you call to
link_to
> > doesn''t actually create a link with class side-link: it
creates a link
> > whose URL contains ?class=side-link. It''s the old "HTML
options need
> > to be in a separate options hash" thing.
>
> > Fred
>
> Thanks Fred I figured it out. Now the only problem that persists is when
> I hover over the links a background with black color appears as the link
> gets focus and I hate it but couldn''t figure out how I can get rid
of
> it. Thanks
> --
> Posted viahttp://www.ruby-forum.com/.
Samiron Rony wrote:> Include the following CSS property for all the anchors in your project > > a{ > outline:none > } > I checked the code in firefox, chrome and IE7. Hope this will work. > If u r using different CSS classes just make sure that any other class > doesnt override this property. > > Thank u > > On Apr 26, 5:01�pm, Jay Pangmi <rails-mailing-l...-ARtvInVfO7ksV2N9l4h3zg@public.gmane.org>Thanks for the reply Samiron, I figured it out. Use of background: none; did the job but the one you said didn''t help. Anyway, I finally had the ugly thing out of my page. Thanks. -- Posted via http://www.ruby-forum.com/.