小编Rus*_*sti的帖子

我正在尝试select使用CSS3 设置元素样式.我在WebKit(Chrome/Safari)中获得了我想要的结果,但Firefox并没有很好地发挥(我甚至不打扰IE).我正在使用CSS3 appearance属性,但出于某种原因,我无法摆脱Firefox中的下拉图标.

这是我正在做的一个例子:http://jsbin.com/aniyu4/2/edit

#dropdown {
 -moz-appearance: none;
 -webkit-appearance: none;
 appearance: none;
 background: transparent url('example.png') no-repeat right center;
 padding: 2px 30px 2px 2px;
 border: none;
}

正如你所看到的,我并没有尝试任何花哨的东西.我只想删除默认样式并添加我自己的下拉箭头.就像我说的,伟大的WebKit,在Firefox中不是很好.显然,-moz-appearance: none没有摆脱下拉项目.

有任何想法吗？不,JavaScript不是一个选项

我正在使用CSS转换来在CSS转换状态之间转换(基本上转换元素的比例).我注意到,当元素转换时,页面上的其余文本(在Webkit中)倾向于稍微改变其呈现,直到转换完成.

小提琴:http://jsfiddle.net/russelluresti/UeNFK/

我还注意到,我的标题上没有这种情况,标题上有-webkit-font-smoothing: antialiased属性/值对.所以,我想知道,有没有办法让文本保持默认外观(字体平滑的"自动"值),而不是在转换过程中改变渲染.

我已经尝试明确设置文本使用"自动"值,但这没有做任何事情.我还应该注意,将字体平滑设置为"无"也会阻止渲染在转换期间闪烁.

任何帮助表示赞赏.

编辑1

我应该注意到我使用的是OS X.在浏览Parallels的Chrome测试时,我没有看到两个不同的段落表现不同,所以这可能是Macs独有的问题.

我正在尝试获取SVG中tspan元素(位于text元素内)的渲染宽度.

这是我的标记:

<text>
    <tspan>Value 1</tspan>
    <tspan>Value 2</tspan>
</text>

在视觉上,我希望值1向左浮动,而值2向右浮动,因此多个元素将如此对齐:

Value 1                                                                   Value 2
Value 10                                                                 Value 20
Value 100                                                               Value 200
Value 1000                                                             Value 2000

由于我想要tpsan("值1"/"值2")的宽度而不是文本元素,我不能使用getBBox(),因为该方法不适用于tspan元素.

奇怪的是,使用jQuery的width()方法将在Chrome中返回正确的值,但NaN在Firefox中返回.任何想法,将不胜感激.

如果我需要查看字符串中是否存在某个值,那么使用.test()方法或.search()方法的性能是否更好？

.search()示例:

var myRegExp = '/Orange/',
    myString = 'This is a string with the word "Orange."';

if(myString.search(myRegExp) != -1) {
    // Do code here
}

.test()示例:

var myRegExp = '/Orange/',
    myString = 'This is a string with the world "Orange."';

if(myRegExp.test(myString)) {
    // Do code here
}

最终,我正在做的是在字符串中搜索特定的类名.该元素将包含多个类,因此我需要查找其中一个类是否在其中.

示例标记:

<ul>
    <li class="expandable expanded">
        <ul>
            <li>Text</li>
        </ul>
    <li>
    <li class="expandable collapsed">
        <ul>
            <li>Text</li>
        </ul>
    </li>
</ul>

所以,我在列表项中添加了一个click事件,如果它们的类名称为"expanded",则需要以一种方式运行,如果它们的类名称为"collapsed",则需要表现另一种.

所以,基本上,这样的事情.

element.addEventListener('click',function(e) {
    if( /* e.target has class name of expanded */ ) { …