Scroll Bar for Leaderboard Home Page / Scrollable Leaderboard / Scroll Through Leaderboard

This CSS tweak will add a vertical scroll bar to your Leaderboard module on the home page. If you only have 4 listings selected, the bar may not show up with 300 height. You can adjust the height to suit your preference.

Add this CSS to My Network/Settings/Appearance/Advanced CSS, at bottom.

Advanced CSS:

/** Scroll Bar for Leaderboard **/
 .xg_widget_main .mini-leaderboard-module .xg_module_body {
height: 300px;overflow : auto;position:relative;
}

 

Alternative Advanced CSS:

This CSS selector seems to change if you move leaderboard to wide column. But, I'm not certain what constitutes the class change to .detailed-leaderboard-module, from .mini-leaderboard-module. Bottom line: Try the following if code above doesn't work.

.xg_widget_main .detailed-leaderboard-module .xg_module_body {
height: 300px;overflow : auto;position:relative;
}

Tags: leader board, leader board scroll, leaderboard scroll, scroll bar for leaderboard, scroll leader board, scroll leaderboard, scrollable leaderboard

Views: 193

Replies to This Discussion

Permalink Reply by Escena Mexico on October 18, 2010 at 2:11pm

ty, Jen... youre the best ever.

Permalink Reply by Ko Nyein on February 23, 2012 at 2:10am

Jen,

the code not work when leaderboadr is in middle coloum.

Thank jen

Permalink Reply by JenSocial on February 23, 2012 at 12:35pm

Thanks for this information. I updated the tip.

Alternative Advanced CSS:

This CSS selector seems to change if you move leaderboard to wide column. But, I'm not certain what constitutes the class change to .detailed-leaderboard-module, from .mini-leaderboard-module. Bottom line: Try the following if code above doesn't work.

 

.xg_widget_main .detailed-leaderboard-module .xg_module_body {
height: 300px;overflow : auto;position:relative;

}

In your case, if this code doesn't work at bottom of CSS, move to top. This means you have an error at bottom. When I tested on your site, I had to add to top of your CSS.

Best,
Jen
Permalink Reply by Ko Nyein on February 23, 2012 at 1:03pm

Thank Jen,

Now this code that you gave work on my site

Permalink Reply by JenSocial on February 23, 2012 at 1:47pm

Great!

RSS

© 2013   Created by JenSocial.   Powered by

Badges  |  Report an Issue  |  Terms of Service

Home
VIP Ning Tips