Possible Duplicate:
07000
我有一个合理长文本的下拉列表.它在Firefox中显示得很好,但是当我在Internet Explorer中点击它时显示有关其大小的文本.
<select style="width:100px;" id="test"> <option>1239187239172391823kajsasdfaasdfas9817293971293</option> <option>1239187239172391823kajsasdfaasdfas9817293971293</option> <option>1239187239172391823kajsasdfaasdfas9817293971293</option> <option>1239187239172391823kajsasdfaasdfas9817293971293</option> </select>
当您在firefox中打开带有上述下拉列表的页面并单击以查看其值时,它将显示完整的描述.
但在Internet Explorer中,单击时它只显示100px,其余文本被激活.
解决方法
这是一个由浏览器呈现引擎和控制器的控件呈现.某些CSS属性可能无法正常工作.为了达到你的目标,尝试制作一些像这样的自定义控件
HTML标记:
<ul id="test"> <li>1239187239172391823kajsasdfaasdfas9817293971293</li> <li>1239187239172391823kajsasdfaasdfas9817293971293</li> <li>1239187239172391823kajsasdfaasdfas9817293971293</li> <li>1239187239172391823kajsasdfaasdfas9817293971293</li> </ul> CSS: #test li{ display:block; background-color:#CCCCCC; border:1px #FFF solid; display:none; width:auto; cursor:pointer; } #test li:hover{ background-color:#999999; }
jQuery的:
$("#test li:first").css({'width':150+'px','display':'block','border':'1px #000 solid','overflow':'hidden','cursor':'pointer'}); $("#test li:first").toggle(function(){ $(this).siblings().css({'display':'list-item','width':'auto'}); },function(){ $(this).siblings().css({'display':'none'}); }
这只是它的粗略草图.
原文地址:https://www.jb51.cc/html/232036.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。