JS 设置线条样式控件

我在做一个VML画线功能，想要动态设置线的样式，
哪位能提供设置样式的控件？？？

解决方案 »

  1.   

    直接JS就可以，如下：1，假设有样式：
    <style type="text/css"> 
    .cur01{background-color:#00CCFF; border:1px solid red; color:#FF3300; font-size:15px; font-weight:bold;}
    </style>2,假设有HTML:
    <div id="box01">This is a box</div>
    <input type="button" name="btn01" value="Test" onClick="javascript:setClass('box01','cur01');">3,JS给ID=box1的DIV设置样式：
    <script language="javascript" type="text/javascript">
    function setClass(objID,className){
    var o=document.getElementById(objID);
    var cName=className;
    o.className=cName;
    }
    </script>
      

  2.   

    自己对应参数加就行了/**
     * VML graphic 
     *///// monitor phaser
    function oval(r)
    {
    return '<rv:oval style="top:'+(180-r)+'; left:'+(180-r)+'; width:'+(2*r)+'; height:'+(2*r)+';position:absolute;" filled="false" strokecolor="gray" strokeweight="1" />';
    }function backRect(ofsetY, ofsetX, strkclr, w, h)
    {
    return '<rv:rect style="top:'+ofsetY+'; left:'+ofsetX+'; width:'+w+'px; height:'+h+'px; position:absolute;" strokecolor="'+strkclr+'" strokeweight="1"  />';
    }function back(ofset, strkclr, w, h, fillclr)
    {
    return '<rv:rect style="top:'+ofset+'; left:'+ofset+'; width:'+w+'px; height:'+h+'px; position:absolute;" strokecolor="'+strkclr+'" strokeweight="1"'+fillclr+' />';
    }function line(x1,y1,x2,y2, lnclr, lnsw)
    {
    return '<rv:line style="position:absolute;" from="'+x1+','+y1+'" to="'+x2+','+y2+'" strokecolor="'+lnclr+'" strokeweight="'+lnsw+'" />';
    }function convLine(x1,y1,x2,y2, lnclr, lnsw){
    return arrowLine(x1+VEC_S, y1+VEC_S, x2+VEC_S, (-1*y2)+VEC_S, lnclr, lnsw);
    }function arrowLine(x1,y1,x2,y2, lnclr, lnsw){
    return '<rv:line style="position:absolute;" from="'+x1+','+y1+'" to="'+x2+','+y2+'" strokecolor="'+lnclr+'" strokeweight="'+lnsw+'"><rv:stroke dashstyle="solid" endarrow="classic" /></rv:line>';
    }function convDotLine(x1,y1,x2,y2, lnclr, lnsw)
    {
    return arrowDotLine(x1+VEC_S, (-1*y1)+VEC_S, x2+VEC_S, (-1*y2)+VEC_S, lnclr, lnsw);
    }function arrowDotLine(x1,y1,x2,y2, lnclr, lnsw)
    {
    return '<rv:line style="position:absolute;" from="'+x1+','+y1+'" to="'+x2+','+y2+'" strokecolor="'+lnclr+'" strokeweight="'+lnsw+'"><rv:stroke dashstyle="dash" endarrow="classic" /></rv:line>';
    }
    /**
     * 锛� startangle銆乪ndangle
     */
    function arc(r, start, end)
    {
    return '<rv:arc style="top:'+(240-r)+'; left:'+(180-r)+'; width:'+(2*r)+'; height:'+(2*r)+';position:absolute;" startangle="'+start+'" endangle="'+end+'" strokecolor="gray" filled="false" strokeweight="1" />';
    }//// monitor harmfunction polyline(polyY, polyX, strkclr, lnsw)
    {
    var ptStr = "";
    for(i=0; i<polyY.length; i++){
    ptStr += polyX[i] + "," + polyY[i] + " ";
    }
    return '<rv:polyline style="position:absolute;" points="'+ptStr+'" strokecolor="'+strkclr+'" strokeweight="'+lnsw+'" filled="false"/>';
    }
    function polyline2(polyY, polyX, ps, pe, strkclr, lnsw)
    {
    var ptStr = "";
    for(i=ps; i<pe; i++){
    ptStr += polyX[i] + "," + polyY[i] + " ";
    }
    return '<rv:polyline style="position:absolute;" points="'+ptStr+'" strokecolor="'+strkclr+'" strokeweight="'+lnsw+'" filled="false"/>';
    }
    function rect(ofsetY, ofsetX, strkclr, w, h, fillclr)
    {
    return '<rv:rect style="position:absolute; top:'+ofsetY+'; left:'+ofsetX+'; width:'+w+'px; height:'+h+'px;"  fillcolor="'+fillclr+'" strokecolor="'+strkclr+'" strokeweight="1" />';
    }///// pqvif list
    function dotLine(x1,y1,x2,y2, lnclr, lnsw){
    return '<rv:line style="position:absolute;" from="'+x1+','+y1+'" to="'+x2+','+y2+'" strokecolor="'+lnclr+'" strokeweight="'+lnsw+'"><rv:stroke dashstyle="dot" endarrow="none" /></rv:line>';
    }function setVString(x1,y1,x2,y2, str, lnclr, lnsw){
    x2 += 0.05;
    return '<rv:line style=\"position:absolute;\" from="'+x1+','+y1+'\" to="'+x2+','+y2+'" strokecolor=\"'+lnclr+'\" strokeweight=\"'+lnsw+'\" filled=\"true\"><rv:path textpathok=\"true\" /><rv:fill type=\"solid\" color=\"'+lnclr+'\" /><rv:textpath on=\"true\" string=\"'+str+'" style=\"font:normal normal normal 14pt \'verdana\'\"/></rv:line>';
    // verdana, Arial Black, Sans-Serif, gradient, color2c="'+lnclr+'"
    }
      

  3.   

    给个完整的：
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>无标题文档</title>
    </head>
    <style type="text/css">
    .cur01{background-color:#00CCFF; border:1px solid red; font-family:verdana; color:#FF3300; 
    font-size:15px; font-weight:bold; padding:10px;}
    </style>
    <body>
    <div id="box01">This is a box </div> 
    <input type="button" name="btn01" value="Test" onClick="javascript:setClass('box01','cur01');"> 
    <script language="javascript" type="text/javascript"> 
    function setClass(objID,className){ 
    var o=document.getElementById(objID); 
    var cName=className; 
    o.className=cName; 
    } 
    </script>
    </body>
    </html>