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

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

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

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

jQuery（文档）.ready（函数（）{
jQuery（'#MyToggleSwitch'）.live（'click'，函数（事件）{
jQuery（'.ElementToHideAndShow'）.toggle（'show'）；
});
});

---

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

我不知道你为什么需要向下移动按钮来隐藏它。你觉得怎么样？另外，如果只隐藏1个元素，为什么它是类而不是id

编辑：什么

---

编辑：这里是。但是，不能使用animate（）为颜色设置动画。不过，可能有一些插件可以做到这一点。

我不想隐藏按钮。我希望这个按钮像一个电灯开关，因此可以上下移动。这是一个类，因为元素同时存在于多个地方，我希望它们都隐藏并同时显示。我更新了我的帖子以获得另一个链接。也许这就是你的意思？有没有一种方法可以让按钮的位置在点击时变得轻松，而不是瞬间的？在它上面。给我一点时间，伙计！完成。不幸的是，jQuery默认情况下无法设置颜色动画。