Foros del Web - Ver Mensaje Individual

alvaaz · #1 (**permalink**) 06/03/2015, 12:02

Hola comunidad,

Mediante la etiqueta SELECT de una página de marcado HTML 5, quiero agregar distintas hojas de estilos a la plantilla principal para que cambie según el tamaño de dispositivo. Tengo una para PC en alta definición, tablet, móvil y PC normal.

Código HTML:

Ver original<head>
    <meta charset="UTF-8">
    <title>Hola</title>
    <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
    <script type="text/javascript">
            $(document).ready(inicio)
            function inicio(){
                $("select").change(cambiacss);
            }
            function cambiacss(){
                var plantilla = $("select").attr("value");
                $("plantilla").html('<link rel=Stylesheet href="css/'+plantilla+'.css" type="text/css">')
            }
    </script>
    <link rel="Stylesheet" href="css/base.css" type="text/css">
    <plantilla>
 
    </plantilla>
</head>

Con el código JavaScript siguiente pretendo agregar una línea en la etiqueta PLANTILLA, de esta manera se le agregarán más propiedades.

Código Javascript:

Ver original<script type="text/javascript">
    $(document).ready(inicio)
    function inicio(){
        $("select").change(cambiacss);
    }
    function cambiacss(){
        var plantilla = $("select").attr("value");
        $("plantilla").html('<link rel=Stylesheet href="css/'+plantilla+'.css" type="text/css">')
    }
</script>

Pero no entiendo porque no funciona.