Hola,
Recién comenzando con la programación jQuery, me encuentro con un extraño (al menos para mí) problema.
Estoy re-modificando mi web para hacerla adaptable a móviles (responsive), y en una parte me he quedado atascado porque necesito modificar la posición de unos elementos dependiendo de si es o no una pantalla pequeña.
Mi código lo tengo así:
Código:
<script type="text/javascript">
$(document).ready(function(e) {
var txt;
if ($(window).width() < 833)
txt = "<table><tr><td><h2>Campo1</h2></td></tr><tr><td><h2>Campo2</h2></td></tr><tr><td><h2>Campo3</h2></td></tr>";
else
txt = "<table><tr><td><h2>Campo1</h2></td><td><h2>Campo2</h2></td><td><h2>Campo3</h2></td></tr>";
$('#docsCont').html(txt);
});
</script>
<div id="docsCont">
Texto en blanco
</div>
Lo cual se supone que debería hacer lo siguiente: Si la pantalla es grande, se pone una tabla con 1 columna y 3 filas; si es pequeña, pone 3 columnas de una fila...
El problema radica en que
nunca modifica el contenido del DIV. Ponga lo que ponga.
He intentado algo más simple:
Código:
<script type="text/javascript">
$(document).ready(function(e) {
$('#docsCont').html("ola k ase");
});
</script>
<div id="docsCont">
Texto en blanco
</div>
Pero de igual forma no me deja modificar nada.
¿Cuál puede ser el error?