Cómo configurar overflow-x con jQuery? O bien: ¿Cómo establecer propiedades css con un '-' (guión)?

Question

me gustaría establecer la propiedad overflow-x CSS con jQuery, pero no funciona:

$('.mySelector').css({ 
    color: 'Red', 
    overflow: 'auto', 
    overflow-x: 'scroll' 
}); 

¿Cómo puedo configurar las propiedades que tienen un '-' (guión) en ellos?

Answer 1

Se puede utilizar cualquiera de camello caso:

$('.mySelector').css({ 
    color: 'Red', 
    overflow: 'auto', 
    overflowX: 'scroll' 
}); 

O citadas claves:

$('.mySelector').css({ 
    color: 'Red', 
    overflow: 'auto', 
    'overflow-x': 'scroll' 
}); 

recomendaría claves citadas, me resulta más fácil decir 'de un vistazo' lo que una regla se compara con camel-casing.

Answer 2

Puede citarlo (con comillas simples o dobles) o usar la variante de caja de camello (que el DOM adoptó con su objeto style, porque - no son legales en los identificadores).

$('.mySelector').css({ 
    'color': 'Red', 
    'overflow': 'auto', 
    'overflow-x': 'scroll' 
});