2021-04-18 10:23:24 +00:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "utf-8" >
< title > YBlog - jQuery Tag Cloud< / title >
< meta name = "keywords" content = "jQuery, javascript, web, ruby" / >
< link rel = "shortcut icon" type = "image/x-icon" href = "../../../../Scratch/img/favicon.ico" / >
2021-05-25 20:25:47 +00:00
< link rel = "stylesheet" type = "text/css" href = "/css/y.css" / >
< link rel = "stylesheet" type = "text/css" href = "/css/legacy.css" / >
< link rel = "alternate" type = "application/rss+xml" title = "RSS" href = "/rss.xml" / >
2021-04-18 10:23:24 +00:00
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< link rel = "apple-touch-icon" href = "../../../../Scratch/img/about/FlatAvatar@2x.png" / >
<!-- [if lt IE 9]>
< script src = "http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js" > < / script >
<![endif]-->
<!-- IndieAuth -->
< link href = "https://twitter.com/yogsototh" rel = "me" >
< link href = "https://github.com/yogsototh" rel = "me" >
< link href = "mailto:yann.esposito@gmail.com" rel = "me" >
< link rel = "pgpkey" href = "../../../../pubkey.txt" >
< / head >
< body lang = "en" class = "article" >
< div id = "content" >
< div id = "header" >
< div id = "choix" >
< span id = "choixlang" >
< a href = "../../../../Scratch/fr/blog/2009-09-jQuery-Tag-Cloud/" > French< / a >
< / span >
< span class = "tomenu" > < a href = "#navigation" > ↓ Menu ↓< / a > < / span >
< span class = "flush" > < / span >
< / div >
< / div >
< div id = "titre" >
< h1 > jQuery Tag Cloud< / h1 >
< / div >
< div class = "flush" > < / div >
< div id = "afterheader" class = "article" >
< div class = "corps" >
< p > Here is how I done the tag cloud of my blog. It is done mostly in jQuery. All my site is static and pages are generated with < a href = "http://nanoc.stoneship.org" > nanoc< / a > . It is (in my humble opinion) the modern geek way to make a website. The tagcloud should work for machine with and without javascript.< / p >
< p > This is why I’ < / p >
< p > Here is what you should obtain:< / p >
< hr / >
< div >
< p > < %= tagCloud %> < / p >
< / div >
< hr / >
< h1 id = "jquery" > jQuery< / h1 >
< p > Here is the simple jQuery code:< / p >
< div >
< div class = "sourceCode" id = "cb1" > < pre class = "sourceCode javascript" > < code class = "sourceCode javascript" > < a class = "sourceLine" id = "cb1-1" title = "1" > < span class = "at" > $< / span > (document).< span class = "at" > ready< / span > ( < span class = "kw" > function< / span > ()< span class = "op" > {< / span > < span class = "at" > $< / span > (< span class = "st" > '.list'< / span > ).< span class = "at" > hide< / span > ()< span class = "op" > ;}< / span > )< span class = "op" > ;< / span > < / a >
< a class = "sourceLine" id = "cb1-2" title = "2" > < span class = "kw" > function< / span > < span class = "at" > tagSelected< / span > (id) < span class = "op" > {< / span > < / a >
< a class = "sourceLine" id = "cb1-3" title = "3" > < span class = "at" > $< / span > (< span class = "st" > '.list'< / span > ).< span class = "at" > hide< / span > ()< span class = "op" > ;< / span > < / a >
< a class = "sourceLine" id = "cb1-4" title = "4" > < span class = "at" > $< / span > (< span class = "st" > '#'< / span > < span class = "op" > +< / span > id).< span class = "at" > fadeIn< / span > ()< span class = "op" > ;< / span > < / a >
< a class = "sourceLine" id = "cb1-5" title = "5" > < span class = "at" > $< / span > (< span class = "st" > '.tag.selected'< / span > ).< span class = "at" > removeClass< / span > (< span class = "st" > 'selected'< / span > )< span class = "op" > ;< / span > < / a >
< a class = "sourceLine" id = "cb1-6" title = "6" > < span class = "at" > $< / span > (< span class = "st" > '#tag_'< / span > < span class = "op" > +< / span > id).< span class = "at" > addClass< / span > (< span class = "st" > 'selected'< / span > )< span class = "op" > ;< / span > < / a >
< a class = "sourceLine" id = "cb1-7" title = "7" > < span class = "op" > }< / span > < / a > < / code > < / pre > < / div >
< / div >
< p > This code will hide all the div containing links to articles containing the tag. And create a function do show the div containing the tag.< / p >
< p > For each tag I create a span element:< / p >
< div >
< div class = "sourceCode" id = "cb2" > < pre class = "sourceCode html" > < code class = "sourceCode html" > < a class = "sourceLine" id = "cb2-1" title = "1" > < span class = "kw" > < span< / span > < span class = "ot" > style=< / span > < span class = "st" > " font-size: 1.0em;" < / span > < / a >
< a class = "sourceLine" id = "cb2-2" title = "2" > < span class = "ot" > class=< / span > < span class = "st" > " tag" < / span > < / a >
< a class = "sourceLine" id = "cb2-3" title = "3" > < span class = "ot" > onClick=< / span > < span class = "st" > " tagSelected('[TAG]')" < / span > < / a >
< a class = "sourceLine" id = "cb2-4" title = "4" > < span class = "ot" > id=< / span > < span class = "st" > " tag_[TAG]" < / span > < span class = "kw" > > < / span > < / a >
< a class = "sourceLine" id = "cb2-5" title = "5" > [TAG]< / a >
< a class = "sourceLine" id = "cb2-6" title = "6" > < span class = "kw" > < /span> < / span > < / a > < / code > < / pre > < / div >
< / div >
< p > and a div containing links associtated to this tag:< / p >
< div >
< div class = "sourceCode" id = "cb3" > < pre class = "sourceCode html" > < code class = "sourceCode html" > < a class = "sourceLine" id = "cb3-1" title = "1" > < span class = "kw" > < div< / span > < span class = "ot" > id=< / span > < span class = "st" > " [TAG]" < / span > < span class = "kw" > > < / span > < / a >
< a class = "sourceLine" id = "cb3-2" title = "2" > < span class = "kw" > < h4> < / span > [TAG]< span class = "kw" > < /h4> < / span > < / a >
< a class = "sourceLine" id = "cb3-3" title = "3" > < span class = "kw" > < ul> < / span > < / a >
< a class = "sourceLine" id = "cb3-4" title = "4" > < span class = "kw" > < li> < / span > LINK 1 < span class = "kw" > < /li> < / span > < / a >
< a class = "sourceLine" id = "cb3-5" title = "5" > < span class = "kw" > < li> < / span > LINK 2 < span class = "kw" > < /li> < / span > < / a >
< a class = "sourceLine" id = "cb3-6" title = "6" > < span class = "kw" > < /ul> < / span > < / a >
< a class = "sourceLine" id = "cb3-7" title = "7" > < span class = "kw" > < /div> < / span > < / a > < / code > < / pre > < / div >
< / div >
< hr / >
< h1 id = "nanoc" > nanoc< / h1 >
< p > Here is how I generate this using nanoc 2.< / p >
< p > If you want to make it fully jQuery one, it shouldn’ < / p >
< p > In a first time < code > tags< / code > correpond of the list of all tags.< / p >
< div >
< div class = "sourceCode" id = "cb4" > < pre class = "sourceCode ruby" > < code class = "sourceCode ruby" > < a class = "sourceLine" id = "cb4-1" title = "1" > < span class = "kw" > def< / span > tags< / a >
< a class = "sourceLine" id = "cb4-2" title = "2" > < span class = "kw" > return< / span > < span class = "ot" > @items< / span > .tags.join(< span class = "st" > ', '< / span > )< / a >
< a class = "sourceLine" id = "cb4-3" title = "3" > < span class = "kw" > end< / span > < / a > < / code > < / pre > < / div >
< / div >
< p > A function to create a data structure associating to each tag its occurence.< / p >
< div >
< div class = "sourceCode" id = "cb5" > < pre class = "sourceCode ruby" > < code class = "sourceCode ruby" > < a class = "sourceLine" id = "cb5-1" title = "1" > < span class = "co" > # generate an hash tag => number of occurence of tag< / span > < / a >
< a class = "sourceLine" id = "cb5-2" title = "2" > < span class = "kw" > def< / span > tagNumber< / a >
< a class = "sourceLine" id = "cb5-3" title = "3" > tags={}< / a >
< a class = "sourceLine" id = "cb5-4" title = "4" > < span class = "ot" > @items< / span > .each < span class = "kw" > do< / span > |p|< / a >
< a class = "sourceLine" id = "cb5-5" title = "5" > < span class = "kw" > if< / span > p.tags.nil?< / a >
< a class = "sourceLine" id = "cb5-6" title = "6" > < span class = "kw" > next< / span > < / a >
< a class = "sourceLine" id = "cb5-7" title = "7" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb5-8" title = "8" > p.tags.each < span class = "kw" > do< / span > |t|< / a >
< a class = "sourceLine" id = "cb5-9" title = "9" > < span class = "kw" > if< / span > tags[t]< / a >
< a class = "sourceLine" id = "cb5-10" title = "10" > tags[t]+=< span class = "dv" > 1< / span > < / a >
< a class = "sourceLine" id = "cb5-11" title = "11" > < span class = "kw" > else< / span > < / a >
< a class = "sourceLine" id = "cb5-12" title = "12" > tags[t]=< span class = "dv" > 1< / span > < / a >
< a class = "sourceLine" id = "cb5-13" title = "13" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb5-14" title = "14" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb5-15" title = "15" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb5-16" title = "16" > < span class = "kw" > return< / span > tags< / a >
< a class = "sourceLine" id = "cb5-17" title = "17" > < span class = "kw" > end< / span > < / a > < / code > < / pre > < / div >
< / div >
< p > I also need a data structure who associate to each tag a list of pages (at least url and title).< / p >
< div >
< div class = "sourceCode" id = "cb6" > < pre class = "sourceCode ruby" > < code class = "sourceCode ruby" > < a class = "sourceLine" id = "cb6-1" title = "1" > < span class = "co" > # generate an hash tag => [ page1, page2 ... ]< / span > < / a >
< a class = "sourceLine" id = "cb6-2" title = "2" > < span class = "kw" > def< / span > tagRefs< / a >
< a class = "sourceLine" id = "cb6-3" title = "3" > tagLinks={}< / a >
< a class = "sourceLine" id = "cb6-4" title = "4" > < span class = "ot" > @items< / span > .each < span class = "kw" > do< / span > |p|< / a >
< a class = "sourceLine" id = "cb6-5" title = "5" > < span class = "kw" > if< / span > p.tags.nil?< / a >
< a class = "sourceLine" id = "cb6-6" title = "6" > < span class = "kw" > next< / span > < / a >
< a class = "sourceLine" id = "cb6-7" title = "7" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb6-8" title = "8" > p.tags.each < span class = "kw" > do< / span > |t|< / a >
< a class = "sourceLine" id = "cb6-9" title = "9" > < span class = "kw" > if< / span > tagLinks[t].nil?< / a >
< a class = "sourceLine" id = "cb6-10" title = "10" > tagLinks[t]=[ p ]< / a >
< a class = "sourceLine" id = "cb6-11" title = "11" > < span class = "kw" > else< / span > < / a >
< a class = "sourceLine" id = "cb6-12" title = "12" > tagLinks[t] < < = p< / a >
< a class = "sourceLine" id = "cb6-13" title = "13" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb6-14" title = "14" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb6-15" title = "15" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb6-16" title = "16" > < span class = "kw" > return< / span > tagLinks< / a >
< a class = "sourceLine" id = "cb6-17" title = "17" > < span class = "kw" > end< / span > < / a > < / code > < / pre > < / div >
< / div >
< p > Calculate the real size of each tag to be displayed.< / p >
< p > I choosen not to use the full range of size for all the tag. Because if no tag has more than < code > n< / code > (here 10) occurences, then it doesn’ < / p >
< div >
< div class = "sourceCode" id = "cb7" > < pre class = "sourceCode ruby" > < code class = "sourceCode ruby" > < a class = "sourceLine" id = "cb7-1" title = "1" > < span class = "kw" > def< / span > tagRealSize< / a >
< a class = "sourceLine" id = "cb7-2" title = "2" > tags=tagNumber< / a >
< a class = "sourceLine" id = "cb7-3" title = "3" > max=tags.values.max< / a >
< a class = "sourceLine" id = "cb7-4" title = "4" > min=tags.values.min< / a >
< a class = "sourceLine" id = "cb7-5" title = "5" > < span class = "co" > # size in CSS em.< / span > < / a >
< a class = "sourceLine" id = "cb7-6" title = "6" > minSize=< span class = "fl" > 1.0< / span > < / a >
< a class = "sourceLine" id = "cb7-7" title = "7" > maxSize=< span class = "fl" > 2.5< / span > < / a >
< a class = "sourceLine" id = "cb7-8" title = "8" > tagSize={}< / a >
< a class = "sourceLine" id = "cb7-9" title = "9" > tags.each < span class = "kw" > do< / span > |t,n|< / a >
< a class = "sourceLine" id = "cb7-10" title = "10" > < span class = "kw" > if< / span > ( max == min )< / a >
< a class = "sourceLine" id = "cb7-11" title = "11" > tagSize[t]=minSize< / a >
< a class = "sourceLine" id = "cb7-12" title = "12" > < span class = "kw" > else< / span > < / a >
< a class = "sourceLine" id = "cb7-13" title = "13" > < span class = "co" > # normalized value between 0 and 1< / span > < / a >
< a class = "sourceLine" id = "cb7-14" title = "14" > < span class = "co" > # if not tag appear more than 10 times,< / span > < / a >
< a class = "sourceLine" id = "cb7-15" title = "15" > < span class = "co" > # then it cannot have the maximal size< / span > < / a >
< a class = "sourceLine" id = "cb7-16" title = "16" > tagSize[t]=[ ( n - min + < span class = "fl" > 0.0< / span > ) / ( max - min ) ,< / a >
< a class = "sourceLine" id = "cb7-17" title = "17" > (n - min) / < span class = "fl" > 10.0< / span > ].min< / a >
< a class = "sourceLine" id = "cb7-18" title = "18" > < span class = "co" > # from normalized size to real size< / span > < / a >
< a class = "sourceLine" id = "cb7-19" title = "19" > tagSize[t]=( tagSize[t] ) * (maxSize - minSize) + minSize< / a >
< a class = "sourceLine" id = "cb7-20" title = "20" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb7-21" title = "21" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb7-22" title = "22" > < span class = "kw" > return< / span > tagSize< / a >
< a class = "sourceLine" id = "cb7-23" title = "23" > < span class = "kw" > end< / span > < / a > < / code > < / pre > < / div >
< / div >
< p > Finaly a function to generate the XHTML/jQuery code< / p >
< div >
< div class = "sourceCode" id = "cb8" > < pre class = "sourceCode ruby" > < code class = "sourceCode ruby" > < a class = "sourceLine" id = "cb8-1" title = "1" > < span class = "co" > # generate an XHTML/jQuery code for tag cloud< / span > < / a >
< a class = "sourceLine" id = "cb8-2" title = "2" > < span class = "kw" > def< / span > tagCloud< / a >
< a class = "sourceLine" id = "cb8-3" title = "3" > tagLinks=tagRefs< / a >
< a class = "sourceLine" id = "cb8-4" title = "4" > tagSize=tagRealSize< / a >
< a class = "sourceLine" id = "cb8-5" title = "5" > < / a >
< a class = "sourceLine" id = "cb8-6" title = "6" > < span class = "co" > # begin to write the code< / span > < / a >
< a class = "sourceLine" id = "cb8-7" title = "7" > tagCloud=< span class = "ot" > %{< / span > < span class = "st" > < script type=" text/javascript" > < / span > < / a >
< a class = "sourceLine" id = "cb8-8" title = "8" > < span class = "st" > $(document).ready( function(){$('.list').hide();} );< / span > < / a >
< a class = "sourceLine" id = "cb8-9" title = "9" > < span class = "st" > function tagSelected(id) {< / span > < / a >
< a class = "sourceLine" id = "cb8-10" title = "10" > < span class = "st" > $('.list').hide();< / span > < / a >
< a class = "sourceLine" id = "cb8-11" title = "11" > < span class = "st" > $('#'+id).fadeIn();< / span > < / a >
< a class = "sourceLine" id = "cb8-12" title = "12" > < span class = "st" > $('.tag.selected').removeClass('selected');< / span > < / a >
< a class = "sourceLine" id = "cb8-13" title = "13" > < span class = "st" > $('#tag_'+id).addClass('selected');< / span > < / a >
< a class = "sourceLine" id = "cb8-14" title = "14" > < span class = "st" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-15" title = "15" > < span class = "st" > < /script> < div id=" tagcloud" > < / span > < span class = "ot" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-16" title = "16" > < span class = "co" > # Creation of the tags < span> < / span > < / a >
< a class = "sourceLine" id = "cb8-17" title = "17" > tagSize.sort{|a,b| a[< span class = "dv" > 0< / span > ].downcase < => b[< span class = "dv" > 0< / span > ].downcase}.each < span class = "kw" > do< / span > |t,s|< / a >
< a class = "sourceLine" id = "cb8-18" title = "18" > tag_in_id=t.gsub(< span class = "ot" > /\W/< / span > ,< span class = "ch" > '_'< / span > )< / a >
< a class = "sourceLine" id = "cb8-19" title = "19" > < span class = "co" > # HTML protected version of the tag< / span > < / a >
< a class = "sourceLine" id = "cb8-20" title = "20" > < span class = "co" > # for example, replace ' ' by '& nbsp;'< / span > < / a >
< a class = "sourceLine" id = "cb8-21" title = "21" > < span class = "kw" > protected< / span > =t.gsub(< span class = "ot" > /& /< / span > ,< span class = "st" > '& amp;'< / span > ).gsub(< span class = "ot" > / /< / span > ,< span class = "st" > '& nbsp;'< / span > ).gsub(< span class = "ot" > /< /< / span > ,< span class = "st" > '& lt;'< / span > ).gsub(< span class = "ot" > /> /< / span > ,< span class = "st" > '& gt;'< / span > )< / a >
< a class = "sourceLine" id = "cb8-22" title = "22" > tagCloud < < =< span class = "ot" > %{< / span > < / a >
< a class = "sourceLine" id = "cb8-23" title = "23" > < span class = "st" > < span style=" font-size: < / span > < span class = "ot" > #{< / span > s< span class = "ot" > }< / span > < span class = "st" > em;" < / span > < / a >
< a class = "sourceLine" id = "cb8-24" title = "24" > < span class = "st" > class=" tag" < / span > < / a >
< a class = "sourceLine" id = "cb8-25" title = "25" > < span class = "st" > onClick=" tagSelected('< / span > < span class = "ot" > #{< / span > tag_in_id< span class = "ot" > }< / span > < span class = "st" > ')" < / span > < / a >
< a class = "sourceLine" id = "cb8-26" title = "26" > < span class = "st" > id=" tag_< / span > < span class = "ot" > #{< / span > tag_in_id< span class = "ot" > }< / span > < span class = "st" > " > < / span > < / a >
< a class = "sourceLine" id = "cb8-27" title = "27" > < span class = "st" > < / span > < span class = "ot" > #{< / span > < span class = "kw" > protected< / span > < span class = "ot" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-28" title = "28" > < span class = "st" > < /span> < / span > < span class = "ot" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-29" title = "29" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb8-30" title = "30" > tagCloud < < =< span class = "ot" > %{< / span > < span class = "st" > < /div> < div id=" hiddenDivs" > < / span > < span class = "ot" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-31" title = "31" > < span class = "co" > # Creation of the divs containing links associated to a tag.< / span > < / a >
< a class = "sourceLine" id = "cb8-32" title = "32" > tagLinks.each < span class = "kw" > do< / span > |t,l|< / a >
< a class = "sourceLine" id = "cb8-33" title = "33" > tag_in_id=t.gsub(< span class = "ot" > /\W/< / span > ,< span class = "ch" > '_'< / span > )< / a >
< a class = "sourceLine" id = "cb8-34" title = "34" > tagCloud < < =< span class = "ot" > %{< / span > < / a >
< a class = "sourceLine" id = "cb8-35" title = "35" > < span class = "st" > < div id=" < / span > < span class = "ot" > #{< / span > tag_in_id< span class = "ot" > }< / span > < span class = "st" > " class=" list" > < / span > < / a >
< a class = "sourceLine" id = "cb8-36" title = "36" > < span class = "st" > < h4> < / span > < span class = "ot" > #{< / span > t< span class = "ot" > }< / span > < span class = "st" > < /h4> < ul> < / span > < span class = "ot" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-37" title = "37" > < span class = "co" > # generate the link list< / span > < / a >
< a class = "sourceLine" id = "cb8-38" title = "38" > l.each < span class = "kw" > do< / span > |p|< / a >
< a class = "sourceLine" id = "cb8-39" title = "39" > tagCloud < < =< span class = "ot" > %{< / span > < span class = "st" > < li> < a href=" < / span > < span class = "ot" > #{< / span > p.path< span class = "ot" > }< / span > < span class = "st" > " > < / span > < span class = "ot" > #{< / span > p.title< span class = "ot" > }< / span > < span class = "st" > < /a> < /li> < / span > < span class = "ot" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-40" title = "40" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb8-41" title = "41" > tagCloud < < =< span class = "ot" > %{< / span > < span class = "st" > < /ul> < /div> < / span > < span class = "ot" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-42" title = "42" > < span class = "kw" > end< / span > < / a >
< a class = "sourceLine" id = "cb8-43" title = "43" > tagCloud < < =< span class = "ot" > %{< / span > < span class = "st" > < /div> < / span > < span class = "ot" > }< / span > < / a >
< a class = "sourceLine" id = "cb8-44" title = "44" > < span class = "kw" > return< / span > tagCloud < span class = "co" > # yeah I know it is not necessary< / span > < / a >
< a class = "sourceLine" id = "cb8-45" title = "45" > < span class = "kw" > end< / span > < / a > < / code > < / pre > < / div >
< / div >
< p > You can < a href = "../../../../Scratch/en/blog/2009-09-jQuery-Tag-Cloud/code/tag.rb" > download the complete file< / a > to put in your ‘ ’ < / p >
< p > Of course to be nice you need the associated CSS< / p >
< div >
< div class = "sourceCode" id = "cb9" > < pre class = "sourceCode css" > < code class = "sourceCode css" > < a class = "sourceLine" id = "cb9-1" title = "1" > < / a >
< a class = "sourceLine" id = "cb9-2" title = "2" > < span class = "er" > // Change the color when mouse over< / span > < / a >
< a class = "sourceLine" id = "cb9-3" title = "3" > < span class = "fu" > .tag< / span > < span class = "in" > :hover< / span > {< / a >
< a class = "sourceLine" id = "cb9-4" title = "4" > < span class = "kw" > color< / span > : < span class = "cn" > #cc0000< / span > < span class = "op" > ;< / span > }< / a >
< a class = "sourceLine" id = "cb9-5" title = "5" > < / a >
< a class = "sourceLine" id = "cb9-6" title = "6" > < span class = "er" > // Change the color when tag selected< / span > < / a >
< a class = "sourceLine" id = "cb9-7" title = "7" > < span class = "fu" > .tag.selected< / span > {< / a >
< a class = "sourceLine" id = "cb9-8" title = "8" > < span class = "kw" > color< / span > : < span class = "cn" > #6c0000< / span > < span class = "op" > ;< / span > }< / a >
< a class = "sourceLine" id = "cb9-9" title = "9" > < / a >
< a class = "sourceLine" id = "cb9-10" title = "10" > < span class = "er" > // a bit of space and pointer cursor< / span > < / a >
< a class = "sourceLine" id = "cb9-11" title = "11" > < span class = "fu" > .tag< / span > {< / a >
< a class = "sourceLine" id = "cb9-12" title = "12" > < span class = "kw" > cursor< / span > : < span class = "dv" > pointer< / span > < span class = "op" > ;< / span > < / a >
< a class = "sourceLine" id = "cb9-13" title = "13" > < span class = "kw" > margin-left< / span > : < span class = "dv" > .5< / span > < span class = "dt" > em< / span > < span class = "op" > ;< / span > < / a >
< a class = "sourceLine" id = "cb9-14" title = "14" > < span class = "kw" > margin-right< / span > : < span class = "dv" > .5< / span > < span class = "dt" > em< / span > < span class = "op" > ;< / span > }< / a > < / code > < / pre > < / div >
< / div >
< p > That’ < / p >
< / div >
< div id = "afterarticle" >
< div id = "social" >
2021-05-25 20:25:47 +00:00
< a href = "/rss.xml" target = "_blank" rel = "noopener noreferrer nofollow" class = "social" > RSS< / a >
2021-04-18 10:23:24 +00:00
·
< a href = "https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-09-jQuery-Tag-Cloud/%20via%20@yogsototh" target = "_blank" rel = "noopener noreferrer nofollow" class = "social" > Tweet< / a >
·
< a href = "http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/en/blog/2009-09-jQuery-Tag-Cloud/" target = "_blank" rel = "noopener noreferrer nofollow" class = "social" > FB< / a >
< br / >
< a class = "message" href = "../../../../Scratch/en/blog/Social-link-the-right-way/" > These social sharing links preserve your privacy< / a >
< / div >
< div id = "navigation" >
< a href = "../../../../" > Home< / a >
< span class = "sep" > ¦< / span >
< a href = "../../../../Scratch/en/blog" > Blog< / a >
< span class = "sep" > ¦< / span >
< a href = "../../../../Scratch/en/softwares" > Softwares< / a >
< span class = "sep" > ¦< / span >
< a href = "../../../../Scratch/en/about" > About< / a >
< / div >
< div id = "totop" > < a href = "#header" > ↑ Top ↑< / a > < / div >
< div id = "bottom" >
< div >
Published on 2009-09-23
< / div >
< div >
< a href = "https://twitter.com/yogsototh" > Follow @yogsototh< / a >
< / div >
< div >
< a rel = "license" href = "http://creativecommons.org/licenses/by/3.0/deed.en_US" > Yann Esposito©< / a >
< / div >
< div >
Done with
< a href = "http://www.vim.org" target = "_blank" rel = "noopener noreferrer nofollow" > < strike > Vim< / strike > < / a >
< a href = "http://spacemacs.org" target = "_blank" rel = "noopener noreferrer nofollow" > spacemacs< / a >
< span class = "pala" > & < / span >
< a href = "http://nanoc.ws" target = "_blank" rel = "noopener noreferrer nofollow" > < strike > nanoc< / strike > < / a >
< a href = "http://jaspervdj.be/hakyll" target = "_blank" rel = "noopener noreferrer nofollow" > Hakyll< / a >
< / div >
< hr / >
< div style = "max-width: 100%" >
< a href = "https://cardanohub.org" >
< img src = "../../../../Scratch/img/ada-logo.png" class = "simple" style = "height: 16px ;
border-radius: 50%;
vertical-align:middle;
display:inline-block;" />
ADA:
< / a >
< code style = "display:inline-block;
word-wrap:break-word;
text-align: left;
vertical-align: top;
max-width: 85%;">
DdzFFzCqrhtAvdkmATx5Fm8NPJViDy85ZBw13p4XcNzVzvQg8e3vWLXq23JQWFxPEXK6Kvhaxxe7oJt4VMYHxpA2vtCFiP8fziohN6Yp
< / code >
< / div >
< / div >
< / div >
< / div >
< / div >
< / body >
< / html >
