javascript - ボックスを展開するためのフローティング矢印 (jQuery)

Question

ページの展開 div に小さな「V」矢印を追加するのに問題があります。div の境界線に座って、div が展開されたときに下に移動したい (そして、おそらく "^" 矢印に変わる)

しかし、国境の上に浮かせる方法がわかりません。誰か助けてください、またはこの問題に取り組む方法を教えてください。

ページ: http://www.trulyscience.com/test/ (右下の質問の物)

コード: http://jsfiddle.net/tJugd/1070/

一番下に矢印ができたので、divが開くと一番上の矢印も消えますが、それが簡単かどうかはわかりません:P

※タグ更新しました

Answer 1

少し違う方法でやります。開くときと閉じるときに同じ div を使用しますが、別のアイコンが表示されるようにクラスを変更します。

どうぞ: http://jsfiddle.net/tJugd/1091/

これはあなたが意味していたものですか？そうでない場合はお知らせください。

編集 - 矢印を中央に配置するようにデモを更新しました!

最終編集 - 白いコンテナ div に矢印を配置するための追加の css と html を追加