Add Hover Image Effect to Latest Activity, Blogs, Forums, Notes and Text Boxes

Replies to This Discussion

Permalink Reply by MEDARD DU ROCHER - BOPE on October 12, 2010 at 2:55am

thank you for your invitation.

Permalink Reply by Anthony on October 21, 2010 at 3:28pm

Hi Jen...This is so neat...

How did you create the image color or where did you find them, i'm using yours currently?

Permalink Reply by JenSocial on October 21, 2010 at 3:35pm

I actually grabbed the image URL for the alternating rows from my Leaderboard module on home page. This is built-in. I think it's just fine if you use that image. Or, you can use your own image, or just a color.

Best,

Jen

Permalink Reply by JenSocial on May 31, 2011 at 11:22pm

This code has been updated for Forums, and added Notes and Text Box hover effect.

Permalink Reply by Lex Smith on June 2, 2011 at 6:01pm

The Hover effect for text box isn't working on my sites. I copied the code exactly.

 

How do you get the icons red as shown Below

Permalink Reply by JenSocial on June 2, 2011 at 6:11pm

Lex,

Far as I know, in old Editor the icon color is under Settings/Appearance/All Options/Icons

New Design Studio:

Settings/Appearance/Customize/Link & Buttons/Icons

 

On why the text box hover isn't working, don't know. If you have it installed, I'll take a look when I can.

 

Best,

Jen

Permalink Reply by Lex Smith on June 3, 2011 at 4:01pm

Ok  Jen I got the icons fixed. Just take a look and see what I need to fix for the text box hover.

 

Permalink Reply by Fire-Tech on January 21, 2012 at 3:49pm

I just realized that I never did this for my Groups list. Have you had a chance to play with that module yet?

I can get the entire list to work but I'm having a rough go to hover only on individual groups. 

Permalink Reply by JenSocial on January 22, 2012 at 12:26pm

Not sure why I didn't offer in the tip. I think because the only way to hover highlight entire area is using xg_lightborder, and I wasn't thrilled with that.

Give this a try:

/* Groups Hover */
.xg_widget_main .module_groups .xg_lightborder:hover {
background:url('http://static.ning.com/socialnetworkmain/widgets/index/gfx/table/bg_alt.png') repeat scroll 0 0 transparent;

}

 

Best,

Jen

Permalink Reply by Fire-Tech on January 22, 2012 at 3:06pm

Works perfect. I didn't even think about lightborder. I usually try to figure it out myself so I don't have to bug ya....but always learning :)

Thanks so much.

Permalink Reply by Fire-Tech on January 21, 2012 at 5:00pm

I also use the Pushpin code for posts in the Latest Activity and it conflicts with the hover (just on member status posts). 

Just out of curiosity, do you think we could add the pushpin image with a content code "before"?

Something like this:

/* Pushpin Before Content */

#xg_themebody .feed-story-status:before

{background:url("http://api.ning.com/files/LejAFeVnJ1JrMPFmkhEofR*PqsdAwjoiwIU8Vmjjo7dmRd1VmU4J3*wgNPT1sEPIH0WIKW8VOS2HkKJ5QryiCczj*w5ndinS/Bullhorn5.png?width=40") no-repeat!important; margin-top:10px!important; padding-left:60px;}

Permalink Reply by JenSocial on January 22, 2012 at 12:32pm

I don't know about this one. What's the conflict? do you mean the pushpin disappears on hover? If yes, that's what I would expect it to do.

Best,

Jen

• ‹ Previous
• 1
• 2
• Next ›
• Page