Question

我只是制作一个面板，（div）有cookie，可以打开或关闭。我想在点击时打开或关闭div的动画。

我到目前为止的代码是：

var state;
window.onload=function() {
   obj=document.getElementById('closeable');
   state=(state==null)?'hide':state;
   obj.className=state;

   document.getElementById('setup').onclick=function() {
      obj.className=(obj.className=='show')?'hide':'show';
      state=obj.className;
      setCookie();

      return false;
   }
}

function setCookie() {
   exp=new Date();
   plusMonth=exp.getTime()+(31*24*60*60*1000);
   exp.setTime(plusMonth);
   document.cookie='State='+state+';expires='+exp.toGMTString();
}

function readCookie() {
   if(document.cookie) {
      state=document.cookie.split('State=')[1];
   }
}
readCookie();

任何帮助表示赞赏

Answer 1

如果我理解你的问题，我不确定。但是，根据我的理解，我已经把小提琴放在一起，以实现你想要的。看看。

http://jsfiddle.net/mvelaga/de4FE/1

修改

更新小提琴以解决评论中提到的情况

http://jsfiddle.net/mvelaga/de4FE/2/

Answer 2

我假设您正在使用jQuery，因为您已对其进行了标记。

尝试： //在dom准备好了

jQuery(function($) {
    var panel = $('#closable');
    var state = 'hide';

    $('#setup').click(function(e) {
        e.preventDefault();
        if(state == 'hide') {
            // you can use the animate() or 
            // fadeIn()/fadeOut methods, too
            // depending on desired effect
            panel.slideDown();
            $(this).text('Hide');
            state = 'show';
        } else
            panel.slideUp();
            $(this).text('Show');
            state = 'hide';
        }
        setCookie();
    })
    function setCookie() {
         ...
    }
    function readCookie() {
         ...
    }
});

Answer 3

您是否尝试过JQuery toogle+slide？

动画div up and down

3 个答案: