Usar local storage para ajustes de CSS
Iniciado por
Mario Garcia
, nov 10 2014 05:28
AUTOR PREGUNTA #1
Publicado 10 noviembre 2014 - 05:28
Estoy buscando una forma de usar el local storage para asi recordar los ajustes CSS de expandir/colapsar elemento, hasta ahora mi javascript luce como el siguiente (el cual captura e id y maneja las propiedades de expandir/colapsar)
Entonces lo que estoy buscando es algo que me permita capturar el id del div cuando se haga click en un enlace y almacene los cambios y que los recuerde al refrescarse.
function toggleHeight(id, link) { var e = document.getElementById(id); if(e.style.maxHeight == '450px') { e.style.maxHeight = '0px'; } else { e.style.maxHeight = '450px'; } }Entonces lo que estoy buscando es algo que me permita capturar el id del div cuando se haga click en un enlace y almacene los cambios y que los recuerde al refrescarse.
-
¿Tienes la misma pregunta? Yo también
Esto también te interesa!
PREGUNTAS SIMILARES
#3
Publicado 10 noviembre 2014 - 19:42
La idea es separar los metodos de show y hide para que pueda funcionar de manera correcta, te dejo un código de como lo implemente:
Storage.prototype.setObject = function(key, value) { this.setItem(key, JSON.stringify(value)); } Storage.prototype.getObject = function(key) { var value = this.getItem(key); return value && JSON.parse(value); }
var toggleState = localStorage.getObject('toggleState') || {}, MIN_SIZE= '0px', MAX_SIZE= '450px';
function toggleHeight(id, shown) { var e = document.getElementById(id); if(shown === true || (typeof shown === "undefined" && e.style.maxHeight == MIN_SIZE)) { show(id); } else { hide(id); } }
function show(id){ var e = document.getElementById(id); e.style.maxHeight = MAX_SIZE; toggleState[id] = true; localStorage.setObject('toggleState',toggleState); }
function hide(id){ var e = document.getElementById(id); e.style.maxHeight = MIN_SIZE; toggleState[id] = false;
localStorage.setObject('toggleState',toggleState); }
for(var i in toggleState){ toggleHeight(i, toggleState[i]); } toggleHeight('algunID');
AUTOR PREGUNTA #4
Publicado 10 noviembre 2014 - 20:01
Gracias Nieves, siempre con buenos ejemplos 
