重写dropdownlist，编写自定义dropdownlist 控件 ，改变其下拉框的宽度。。

求设计的思路 成品代码也行，望大侠帮忙！！

解决方案 »

  1.   

    OnRender中设定this.Attribute["width"]=...
      

  2.   

    textbox + button + listbox(隐藏DIV层中),挺难的有同事做过
      

  3.   

    dropdownlist 控件已经被封装好了,不好进行修改了吧,可以用div模拟一个dropdownlist写成控件.
      

  4.   

    可参考DNT中Discuz.Control自定义的dropdownlist写法 
    继承System.Web.UI.WebControls.DropDownList,IPostBackDataHandler
      

  5.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" >
    <head><title>
    无标题页
    </title>
      <style type="text/css">
      <!--
        body
        {
          margin: 0px;
          padding: 30px 0px 0px 30px;
          background-color: #CFDFEF;
          font-size: 12px;
        }
        .selectA
        {
          width: 92px;
          height: 17px;
          padding-left: 10px;
          padding-top: 5px;
          background-image: url(http://labs.utombox.com/select2css/tm2008-select.gif);
          overflow: hidden;
          cursor: pointer;
        }
        .selectB
        {
          display: none;
          width: 81px;
          height: auto;
          background-image: url(http://labs.utombox.com/select2css/tm2008-select.gif);
          background-position: -102px 0px;
          border-bottom: 1px solid #4EA0D1;
        }
        .selectB .item
        {
          width: 71px;
          height: 17px;
          background-image: url(http://labs.utombox.com/select2css/tm2008-select.gif);
          background-position: -102px 0px;
          padding-left: 10px;
          padding-top: 5px;
          overflow: hidden;
          cursor: pointer;
        }
      -->
      </style>
      <script type="text/javascript">
      <!--
        //val
        var items = null;
        var selectA = null;
        var selectB = null;
        var selectAClicked = false;    //method
        function $(s)
        {
          return document.getElementById(s);
        }    window.onload = function()
        {
          items = [$("itemA"),$("itemB"),$("itemC"),$("itemD"),$("itemE"),$("itemF"),$("itemG"),$("itemH")];
          selectA = $("selectA");
          selectB = $("selectB");
          //init
          items[0].style.backgroundPosition = "0px -66px";
          //selectA event
          selectA.onmouseover = function()
          {
            if(selectAClicked)
              return;
            this.style.backgroundPosition = "0px -22px";
          }
          selectA.onmouseout = function()
          {
            if(selectAClicked)
              return;
            this.style.backgroundPosition = "0px 0px";
          }
          selectA.onclick = function()
          {
            if(selectAClicked)
            {
              selectAClicked = false;
              this.style.backgroundPosition = "0px -22px";
              selectB.style.display = "none";
              return;
            }
            selectAClicked = true;
            this.style.backgroundPosition = "0px -44px";
            selectB.style.display = "block";
          }
          //selectB event
          //none
          //items event
          function itemMouseOver()
          {
            this.style.backgroundPosition = "0px -88px";
          }
          function itemMouseOut()
          {
            if(this.innerHTML == selectA.innerHTML)
            {
              this.style.backgroundPosition = "0px -66px";
              return;
            }
            this.style.backgroundPosition = "-102px 0px";
          }
          function itemClick()
          {
            for(var i=0,length=items.length;i<length;i++)
              items[i].style.backgroundPosition = "-102px 0px";
            this.style.backgroundPosition = "0px -66px";
            selectA.innerHTML = this.innerHTML;
            selectB.style.display = "none";
            selectA.style.backgroundPosition = "0px 0px";
            selectAClicked = false;
          }
          for(var i=0,length=items.length;i<length;i++)
          {
            items[i].onmouseover = itemMouseOver;
            items[i].onmouseout = itemMouseOut;
            items[i].onclick = itemClick;
          }
        }
      //-->
      </script>
    </head>
    <body>
        <form name="form1" method="post" action="Xialakuang1.aspx" id="form1">
    <div>
    <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNzgzNDMwNTMzZGSuES/3l2GARPXwp6HuuWl6NjfWIA==" />
    </div><div class="selectA" id="selectA">itemA</div>
    <div class="selectB" id="selectB">
      <div class="item" id="itemA">itemA</div>
      <div class="item" id="itemB">itemB</div>
      <div class="item" id="itemC">itemC</div>
      <div class="item" id="itemD">itemD</div>
      <div class="item" id="itemE">itemE</div>
      <div class="item" id="itemF">itemF</div>
      <div class="item" id="itemG">itemG</div>
      <div class="item" id="itemH">itemH</div>
    </div>
        </form>
    </body>
    </html>
      

  6.   

    可参考DNT中Discuz.Control自定义的dropdownlist写法 
    ?是什么？