跪求高手解答：看这个标签云样式，CSS+JS如何写？

http://chenjinghua.net/word-cloud-analysis-of-obamas-inaugural-speech-compared-to-bush-clinton-reagan-lincolns-376.html
这个样式，不用FLASH和JAVA写。用PHP写！我的QQ是：12047343

解决方案 »

  1.   

    也许这个对你有参考  <html xmlns:v="urn:schemas-microsoft-com:vml">
    <head>
    <title>3dtest2</title>
    <script language="JavaScript"><!--
    // abcvar d = document;var isNav, isIE, isNS6;
    if(d.layers) {isNav = 1;}
    else if(d.all) {isIE = 1;}
    else if (d.getElementByID) {isNS6 = 1;}if(!isIE) {
            alert("this experiment requires IE, as it uses VML");
            }function mousemove(e) {
            if (isIE) {
                    mx = window.event.clientX;
                    my = window.event.clientY;
                    }
            else {
                    mx = e.pageX;
                    my = e.pageY;
                    }
            }        
    if (isNav) document.captureEvents(Event.MOUSEMOVE);
    document.onmousemove = mousemove;// vertex definitions:        x,y,z,xp,ypvar b1 = new Array(-40,40,-40,0,0);
    var b2 = new Array(-40,40,40,0,0);
    var b3 = new Array(40,40,40,0,0);
    var b4 = new Array(40,40,-40,0,0);
    var b5 = new Array(-40,-40,-40,0,0);
    var b6 = new Array(-40,-40,40,0,0);
    var b7 = new Array(40,-40,40,0,0);
    var b8 = new Array(40,-40,-40,0,0);function project(vert, obj) {
            vert[3] = Math.floor((vert[0] * dist) / (vert[2] + dist + 40));
            vert[4] = Math.floor((vert[1] * dist) / (vert[2] + dist + 40));
            }function xrotate(vert, deg) {
            cos1 = costable[deg];
            sin1 = sintable[deg];
            y = vert[1];
            z = vert[2];
            vert[1] = (cos1*y) - (sin1*z);
            vert[2] = (sin1*y) + (cos1*z);
            }function yrotate(vert, deg) {
            cos1 = costable[deg];
            sin1 = sintable[deg];
            x = vert[0];
            z = vert[2];
            vert[0] = (cos1*x) + (sin1*z);
            vert[2] = (cos1*z) - (sin1*x);
            }function zrotate(vert, deg) {
            cos1 = costable[deg];
            sin1 = sintable[deg];
            x = vert[0];
            y = vert[1];
            vert[0] = (cos1*x) - (sin1*y);
            vert[1] = (sin1*x) + (cos1*y);
            }        var dist = 90;
    var mx = 100,my = 100;
    var p1,p2,p3,p4,p5,p6,p7,p8;
    var xcenter, ycenter;var sintable = new Array(360);
    var costable = new Array(360);function startup() {
            for(i=-360;i<=360;i++) {
                    costable[i] = Math.cos(i*0.017454);
                    sintable[i] = Math.sin(i*0.017454);
                    }
            main();
            }        function amod(vert, lyr, img, xr, yr, zr) {
            project(vert);
            xrotate(vert,yr);
            yrotate(vert,xr);
            //zrotate(vert,zr);
            }
    /*
          b2--b3       
         /   / |       
       b1--b4  |       
       |  b6--b7
       | /   /
       b5--b8*/var v1path, v2path, v3path, v4path;
    var scrtch = 0;function swip() {
            if(scrtch == "1") {
                    scrtch = 0;
                    c1.path = "m";
                    c2.path = "m";
                    c3.path = "m";
                    c4.path = "m";
                    }
            else {
                    scrtch = 1;
                    }
            }function main() {
            if(scrtch == "1") {
                    c1.path = v1path;
                    c2.path = v2path;
                    c3.path = v3path;
                    c4.path = v4path;
                    }
                    
            xr = -Math.floor((mx-350)/80);
            if(xr > 6) {xr = 6};
            yr = Math.floor((my-250)/80);
            if(yr > 6) {yr = 6};
            zr = 0;        for(i=1;i<=8;i++) {
                    eval("amod(b"+i+",p"+i+",'i"+i+"', xr, yr, zr)");
                    }        v1path = "m "+b1[3]+","+b1[4]+" l "+b2[3]+","+b2[4]+" "+b3[3]+","+b3[4]+" "+b4[3]+","+b4[4]+" x e";
            v2path = "m "+b5[3]+","+b5[4]+" l "+b6[3]+","+b6[4]+" "+b7[3]+","+b7[4]+" "+b8[3]+","+b8[4]+" x e";
            v3path = "m "+b1[3]+","+b1[4]+" l "+b2[3]+","+b2[4]+" "+b6[3]+","+b6[4]+" "+b5[3]+","+b5[4]+" x e";
            v4path = "m "+b3[3]+","+b3[4]+" l "+b4[3]+","+b4[4]+" "+b8[3]+","+b8[4]+" "+b7[3]+","+b7[4]+" x e";
            
            v1.path = v1path;
            v2.path = v2path;
            v3.path = v3path;
            v4.path = v4path;
            
            setTimeout('main()','20');
            }
    //--></script>
    <style type="text/css">
    v\:*{behavior:url(#default#VML);}
    body {font-family: verdana, arial; font-size:10px; color:white;}
    input, select, .cb {background-color: #BB0000; padding:3px;font-family:verdana, helvetica, arial; font-size:10px; border: 0 solid; border-color: #C0E0C0; color:#FFFFFF;}
    a:link, a:visited, a:active {font-family: verdana, arial; font-size:10px; color:white;}
    a:hover {font-family: verdana, arial; font-size:10px; color:red;}</style>
    </head>
    <body onload="startup();" bgcolor="#000000">
    <v:shape id="c1" filled="false" strokecolor="#ff8888" style="visibility:visible;position:absolute;left:300;top:400;width:200;height:200" coordorigin="0, 100" coordsize="100,100"><v:path v="m 0,0 l x e"/></v:shape> 
    <v:shape id="c2" filled="false" strokecolor="#ff8888" style="visibility:visible;position:absolute;left:300;top:400;width:200;height:200" coordorigin="0, 100" coordsize="100,100"><v:path v="m 0,0 l x e"/></v:shape> 
    <v:shape id="c3" filled="false" strokecolor="#ff8888" style="visibility:visible;position:absolute;left:300;top:400;width:200;height:200" coordorigin="0, 100" coordsize="100,100"><v:path v="m 0,0 l x e"/></v:shape> 
    <v:shape id="c4" filled="false" strokecolor="#ff8888" style="visibility:visible;position:absolute;left:300;top:400;width:200;height:200" coordorigin="0, 100" coordsize="100,100"><v:path v="m 0,0 l x e"/></v:shape> 
    <v:shape id="v1" filled="false" strokecolor="white" style="visibility:visible;position:absolute;left:300;top:400;width:200;height:200" coordorigin="0, 100" coordsize="100,100"><v:path v="m 0,0 l 100,100 200,50 x e"/></v:shape> 
    <v:shape id="v2" filled="false" strokecolor="white" style="visibility:visible;position:absolute;left:300;top:400;width:200;height:200" coordorigin="0, 100" coordsize="100,100"><v:path v="m 0,0 l 100,100 200,50 x e"/></v:shape> 
    <v:shape id="v3" filled="false" strokecolor="white" style="visibility:visible;position:absolute;left:300;top:400;width:200;height:200" coordorigin="0, 100" coordsize="100,100"><v:path v="m 0,0 l 100,100 200,50 x e"/></v:shape> 
    <v:shape id="v4" filled="false" strokecolor="white" style="visibility:visible;position:absolute;left:300;top:400;width:200;height:200" coordorigin="0, 100" coordsize="100,100"><v:path v="m 0,0 l 100,100 200,50 x e"/></v:shape> 
    <div style="position:absolute; top:75px; left:122px; width:200;" align="justify"> 
      <br>
    <br>
      <select onchange="dist = Math.floor(this.value);">
            <option value="40">super high</option>
            <option value="50">high</option>
            <option value="90" selected>normal</option>
            <option value="200">low</option>
            <option value="10000">super low</option>
    </select>
    </div>
    </body>
    </html>
      

  2.   

    我发出来得只是一张图而已，我的意思是用CSS+JSS能否写出这种效果，如果能，该如何写？ 图片上的标签样式是用FLASH做的。