切换按钮，显示和隐藏元素，但同时移动按钮

Question

我有一个使用此代码的切换按钮：

<script>
    jQuery(document).ready(function(){
        jQuery('#MyToggleSwitch').live('click', function(event) { 

             jQuery('.ElementToHideAndShow').toggle('show');
        });
    });
</script>

我现在想按下按钮时将#MyToggleSwitch向下移动50px以隐藏元素，然后将其向上移动50px以显示元素....像一个lightswitch一样思考。我还想在按下按钮时更改按钮的颜色。我该怎么做呢？如何在首先隐藏元素的情况下加载页面？

Answer 1

我不确定你为什么需要按下按钮来隐藏它。 this work适合你吗？另外，如果你只隐藏1个元素，为什么它是一个类而不是id？

修改某些内容like this？

修改：此处为one that animates。但是，无法使用animate（）动画颜色。但是，可能有插件可以做到这一点。