The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Hover transparency effect - opacity

View previous topic View next topic Go down

Solved Hover transparency effect - opacity

Post by runawayhorses on April 15th 2012, 8:27 pm

I'm looking for a CSS code to do a hover transparency effect using opacity settings for my "Reply" "New Topic" and "New PM" buttons. It looks something like this code below but that is for navigation buttons, but I need it for the image buttons I mentioned above:

Code:

.navbar .navlinks img{
    opacity:0.9;
    filter:alpha(opacity=90);}

    .navbar .navlinks img:hover{
    opacity:0.4;
    filter:alpha(opacity=40);}

thanks


Last edited by runawayhorses on April 15th 2012, 10:06 pm; edited 1 time in total

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Hover transparency effect - opacity

Post by Guest on April 15th 2012, 8:59 pm

Hi!

Add to CSS Stylesheet:
Code:
.topic-actions .buttons a img{
opacity: 1.0;
filter: alpha(opacity=100);
}

.topic-actions .buttons a img{
opacity: 0.4;
filter: alpha(opacity=40);
}

Guest
Guest


Back to top Go down

Solved Re: Hover transparency effect - opacity

Post by runawayhorses on April 15th 2012, 9:18 pm

Thanks Coddy, but its not working. The Navigation code works I posted above but that code won't for some reason. Any idea why?

On another note, I heard somewhere that it was better to use 0.9 rather than using 1.0 opacity. I think they said something about firefox has a problem with 1.0 but I don't know if that's true anymore. I use firefox but I have my opacity for the Navigation buttons set for 0.9 and 0.6. I use the 0.9 for the regular look and the 0.6 for the mouseover effect. I have rather dark buttons and the lighter effect looks better on mouseover.

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Hover transparency effect - opacity

Post by Keir on April 15th 2012, 9:52 pm

Hi,

Try this code:

Code:
.topic-actions .buttons a img:hover{
opacity: 0.9;
filter: alpha(opacity=90);
}

.topic-actions .buttons a img{
opacity: 0.4;
filter: alpha(opacity=40);
}

Keir
Forumember

Male Posts : 30
Reputation : 3
Language : Romanian
Location : România, Buzau , Podgoria

http://netuts.forumz.ro/

Back to top Go down

Solved Re: Hover transparency effect - opacity

Post by runawayhorses on April 15th 2012, 10:04 pm

Yeah that works thanks Keir I appreciate it! Smile

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Hover transparency effect - opacity

Post by Keir on April 15th 2012, 10:06 pm

With pleasure. Very Happy

Keir
Forumember

Male Posts : 30
Reputation : 3
Language : Romanian
Location : România, Buzau , Podgoria

http://netuts.forumz.ro/

Back to top Go down

Solved Re: Hover transparency effect - opacity

Post by Guest on April 15th 2012, 10:49 pm

Haha, forgot about :hover. Very Happy

Guest
Guest


Back to top Go down

Solved Re: Hover transparency effect - opacity

Post by runawayhorses on April 15th 2012, 11:15 pm

Yeah I noticed that later..lol

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Hover transparency effect - opacity

Post by Jophy on April 16th 2012, 3:45 am

Since this thread is marked as solved, this will be moved now.

Jophy
ForumGuru

Male Posts : 17924
Reputation : 835
Language : English
Location : Somewhere

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum