Carga de archivos CSS de manera asincrónica con JavaScript en SMF

  • Autor Autor Stan Castro
  • Fecha de inicio Fecha de inicio
S

Stan Castro

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Quiero cargar archivos CSS en mi sitio web de manera asincrónica, con JavaScript lo logro colocando el acrónimo async, ejemplo;

JavaScript normal:

<script type="text/javascript" src="http://misitioweb.com/Themes/Reseller/scripts/bootstrap.min.js"></script>

JavaScript cargado de forma asincrónica:

<script type="text/javascript" async src="http://misitioweb.com/Themes/Reseller/scripts/bootstrap.min.js"></script>

La diferencia es el async.

Trate de colocar async en un codigo CSS pero no funciona.

¿Puedo también cargar de manera asincrónica archivos CSS? ¿Alguien sabe cómo hacer esto?

Un saludo y gracias de antemano pos sus respuestas.

PD: no me recomienden ningún plugin, pues que no utilizo WordPress, mi CMS es SMF.
 
Prueba con https://github.com/filamentgroup/loadCSS

Un ejemplo de como usarlo seria:

<head>
<script src="loadCSS.min.js"></script>
<script>
// load a file
loadCSS("Styles-V6.min.css");
</script>
</head>

Éxito !
 
Hola [MENTION=127861]mrebola[/MENTION], estuve mirando la página web que me recomiendas, pero la verdad no entiendo muy bien cómo utilizar este recurso.

Serias tan amable de mostrarme un ejemplo utilizando este código de CSS <link rel="stylesheet" type="text/css" href="http://sitioweb.com/tema/nombre-del-tema/css/bootstrap.css" />

Un saludo y gracias por tus respuestas.
 
si lo mueves antes de la etiqueta </body> lo solucionas...
 
Hola [MENTION=122845]Stan Castro[/MENTION] solo tienes que poner.


<script src="loadCSS.min.js"></script>
<script>
loadCSS("http://sitioweb.com/tema/nombre-del-tema/css/bootstrap.css");
</script>
</head>

No olvides descargar loadCSS.min.js y ponerle bien su ruta en el codigo dentro de las etiquetas head.

Suerte !
 
Hola [MENTION=127861]mrebola[/MENTION] y [MENTION=47298]estudiseno[/MENTION]. Trate de colocar mi archivos CSS antes de la etiqueta </body>, pero no me gusto como visualmente se cargar el foro, carga de manera desordenada (aunque más rápida)

Por otro lado coloque el código:

<script src="loadCSS.min.js"></script>
<script>
loadCSS("http://sitioweb.com/tema/nombre-del-tema/css/bootstrap.css");
</script>

Pero la verdad no me función.
[MENTION=127861]mrebola[/MENTION] ¿Podrías mostrarme un ejemplo en vivo de cómo hacer esto? o ¿Tienes un sitio web en donde apliques esto y lo pueda ver?

Espero sus respuestas…

Un saludo.
 
Hola mrebola y estudiseno. Trate de colocar mi archivos CSS antes de la etiqueta </body>, pero no me gusto como visualmente se cargar el foro, carga de manera desordenada (aunque más rápida)

Por otro lado coloque el código:

<script src="loadCSS.min.js"></script>
<script>
loadCSS("http://sitioweb.com/tema/nombre-del-tema/css/bootstrap.css");
</script>

Pero la verdad no me función.
mrebola ¿Podrías mostrarme un ejemplo en vivo de cómo hacer esto? o ¿Tienes un sitio web en donde apliques esto y lo pueda ver?

Espero sus respuestas…

Un saludo.
Tenes algún error en la consola de desarrollo de tu navegador? (CTRL+SHIFT+I)
No es solamente poner el código que te pasaron...
"loadCSS.min.js" es una librería que tenes que descargar y poner en tu proyecto.
Seguramente está mal la ruta.
 
Atrás
Arriba