jQuery的动画切换 - 动画只能在第二次点击

任务：我想创建一个简单的分享按钮延伸至每股部分（F，T，G，P）点击时。jQuery的动画切换 - 动画只能在第二次点击

我没有让部分滑出分享按钮的 - 我真的，真的很想 - 但设法让一个单独的ul元素滑出右侧。

动画工作... 直到我设置ul通过$('.networks').hide();

最初隐藏部分的目的是点击后才显示出来，但现在后先点击它只是“弹开”无视配置滑出。只有滑动在两个方向（打开和关闭）点击它至少一次之后。

我上传为例here at Codepen.io和作为jsFiddle。

旁注：演示的行为有点怪，因为他们出现只显示滑入FX。滑出FX，与我们开始，总是看起来像它弹开 - 这是不是这样，它的作品第二次点击后，所以你必须关注你的眼睛看到它（在一个普通的浏览器，它明显作品更好）。

PS：奖励积分，如果你帮我做这个滑出的“共享”按钮。请注意，我只有基本的Javascript知识（* duck和run *）。

2012-10-07 pattulus

看看这个小提琴link。

我改变了按钮的显示属性是内联块，而不是内联。显示内联元素不能有宽度，我认为这是为什么jQuery无法动画元素宽度的原因。我也动画了ul而不是ul的包装。

编辑：做的事滑出按钮的快速样机。改变了一些CSS在列表元素本身而不是一个元素，只是通过CSS工作，我认为它会看起来不错。编辑忘了链接：link

2012-10-07 17:07:27

我能说什么更多：完美。非常感谢好友。我整个周末都在思考这个问题，无法摆脱困境。我绝对不会猜测，将inline-block改为inline-block可以解决我试图解决的问题。现在，即使我正在寻找的滑出功能也能正常工作（也请感谢模型）。 – pattulus

非常感谢:) –

回答