uso de CSS externa en lugar de CSS en línea para blockUI

Question

estoy usando blockUI en múltiples lugares y todos ellos tienen las mismas propiedades, así que sigo repitiendo los mismos valores CSS en el lugar que yo uso. ¿Hay alguna manera de ponerlo en un archivo CSS?

Actualmente uso:

$.blockUI({ 
     message: $('#Something'), 
     css: { 
      border: '5px solid #F4712', 
      backgroundColor: '#6F4712', 
      width: '300px' 
     } 
    }); 

puedo utilizar como:

$.blockUI({ 
    message: $('#Something'), 
     css: { 
      class:"alertBox" 
     } 
    }); 

gracias

Answer 1

según la documentation - no se puede.

pero que lo hagas:

the class $(".blockPage").addClass("myClass") 

P. S. asegúrese de no dar ningún estilo en el código mientras escribe.

y actualizar a algo como esto:

$.blockUI({ 
      fadeIn: 1000, 
      timeout: 2000, 
      onBlock: function() { 
       $(".blockPage").addClass("myClass"); 

      } 
     }); 

Answer 2

Se puede definir un estilo para su buzón de mensajes fuera del javascript y css omitir el bloque. En su caso podría ser:

<style type="text/css"> 
div.blockMsg { 
    border: '5px solid #F4712'; 
    backgroundColor: '#6F4712'; 
    width: '300px'; 
} 
</style> 

mirada a this (v2) para más info.

Answer 3

Para clase dinámica añadiendo la primera respuesta trabajaron, pero algunos parpadeo ocurrido, porque la clase se añadió demasiado tarde. por lo que añade a mi clase personalizada antes de la blockUI al cuerpo y cambió mi css un poco y me funciona muy bien:

JS:

$('body').removeClass().addClass('myCustomClass'); 
$.blockUI(); 

CSS:

div.blockPage{// default layout 
width: 30%; 
top: 40%; 
left: 35%; 
text-align:center; 
} 

body.myCustomClass > div.blockPage{ 
width: 90%; 
left: 5%; 
top: 3%; 
text-align:left; 
} 

Answer 4

que sé esta es una vieja pregunta, pero ahora los días puede usar $.blockUI.defaults.css = {}; como se indica en el documentation

Answer 5

Estaba a la mitad de la modificación de mi policía y del complemento blockUI para agregar esta funcionalidad y encontró que ya había una opción de configuración para blockMsgClass, configurar esto en su clase css agrega su clase al bloque.

$.blockUI(
{ 
    blockMsgClass: 'alertBox', 
    message: 'Hello styled popup' 
}); 

Una cosa a destacar es que aunque el código plugin utiliza CSS en línea por lo que necesita para marcar tan importante para los campos tales como text-align, color, borde, color de fondo y el cursor: esperar.

.alertBox 
{ 
    border:none !important; 
    background-color: #437DD4 !important; 
    color: #fff !important; 
    cursor: default !important; 
} 

Answer 6

esto quizás una vieja pregunta, pero aquí es la respuesta para cualquiera que lo necesite http://malsup.com/jquery/block/stylesheet.html básicamente va a desactivar el css por defecto por esta línea
$ .blockUI.defaults.css = {};

y luego agregar su estilo css dentro de un archivo separado o así.