20080212 Tuesday February 12, 2008

Added a Tag Cloud I added a tag cloud to this site tonight. Thanks to Rich Sharple's Hacking Roller : Tag Clouds, it was pretty easy. It's currently located in the bottom-right corner. Here's a glance at this site's most popular tags:

acegi appfuse denver grails gwt hibernate ibatis java jsf maven maven2 myfaces rails roller skiing spring springmvc stripes struts struts2 tapestry tomcat travel webframeworks wicket

Enjoy! Posted in Roller at Feb 12 2008, 10:04:07 PM MST 4 Comments

Comments:

Aren't you going to make them change size depending on popularity?

Posted by Antony Stubbs on February 12, 2008 at 11:19 PM MST #

It does change size in Safari and Firefox on OS X - maybe you need to use Shift+F5 to get the updated stylesheet? Here's a screenshot.

Posted by Matt Raible on February 13, 2008 at 12:09 AM MST #

Matt, you seem to have better consistency between IE / FF than my version - did you change the CSS ? If so could you post the changes ? Thanks in advance, Rich

Posted by Rich Sharples on February 13, 2008 at 07:13 AM MST #

Rich - you can find the CSS at the bottom of my layout.css. I've pasted it below for your convenience:

/* TAG CLOUD */
.tagcloud {
    padding-left: 10px;
}

.s10 {
    font-size: 18px;
}

.s9 {
    font-size: 17px;
    filter: alpha(opacity=90); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);
    opacity: .9;
}

.s8 {
    font-size: 16px;
    filter: alpha(opacity=85); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=85);
    opacity: .85;
}

.s7 {
    font-size: 15px;
    filter: alpha(opacity=80); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
    opacity: .80;
}

.s6 {
    font-size: 14px;
    filter: alpha(opacity=75); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=75);
    opacity: .75;
}

.s5 {
    font-size: 13px;
    filter: alpha(opacity=70); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
    opacity: .70;
}

.s4 {
    font-size: 12px;
    filter: alpha(opacity=60); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
    opacity: .6;
}

.s3 {
    font-size: 11px;
    filter: alpha(opacity=55); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=55);
    opacity: .55;
}

.s2 {
    font-size: 10px;
    filter: alpha(opacity=50); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
    opacity: .50;
}

.s1 {
    font-size: 9px;
    filter: alpha(opacity=40); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
    opacity: .4;
}

.s0 {
    font-size: 8px;
    filter: alpha(opacity=30); 
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=30);
    opacity: .30;
}

Posted by Matt Raible on February 13, 2008 at 08:21 AM MST #

Post a Comment:
  • HTML Syntax: Allowed
Click me to subscribe
Matt Raible is the Lead UI Architect at LinkedIn. The opinions on this site are mine, not my employers.
« September 2008
SunMonTueWedThuFriSat
 
1
2
4
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
    
       
Today

Recent Entries

Tag Cloud