mootools FX.slideOut摺疊錶行

我借用mootools的動畫刪除借用David Walsh tutorial中的一些代碼。mootools FX.slideOut摺疊錶行

當我在表格行上使用Mootools FX.slide時，它會在水平滑動之前水平摺疊行，這不是所需的效果。

有一個小提琴在這裏，如果你想採取look-- http://jsfiddle.net/gNvvT/

我怎樣才能讓這種效果平穩滑動垂直，而不是壓扁離開，然後呢？

謝謝！

2011-12-20 julio

恐怕Fx.Slide不能使用錶行，但只能使用塊元素。正如Dimitar Christoff對你所說的那樣。

我修改了你的小提琴來解決這個問題。從你發佈的代碼看來，你對Mootools非常實用，所以我只是寫了一些關於代碼的評論。我相信你會得到這個訣竅。

http://jsfiddle.net/gNvvT/5/

讓我知道，如果它在你的現實世界應用！

編輯。我從以前的測試中遺留了一些無用的代碼。我刪除它，我更新了小提琴URL。

2011-12-20 22:15:12

夠公平的，+1的努力:)看到桌子讓我畏懼這些日子，即使是表格數據。 http://shouldiusetablesforlayout.com/ –

我同意。總是有辦法使用塊元素來做表格......但是有些情況下，表格實際上很舒服...... –

@ DimitarChristoff--感謝您的幫助！我希望我能接受這兩個答案。我感謝你們花時間展示替代品和例子。我同意我最終可能會以div格式重建此表單，但目前我不想做出重大改變，所以我正在使用lorenzo的解決方法。感謝你們倆。 – julio

這是因爲TR不是真正的塊式樣元素，它是display: table-row（iirc）。

的Fx.Slide類實際上剛剛2招數它試圖採用以使它看起來像它的溶解，基本上是：從可見

它，然後允許其操縱元素的高度，使其體積更小等

跳發生，因爲它改變了顯示器/溢出，這一切隨着其瓦解後表去搞笑。

你應該考慮另一種方式，比如淡入淡出和縮放轉換。

2011-12-20 21:59:39

我正在爲一個棘手的修復工作... –

它不需要棘手，取決於你以後。這是與一個簡單的CSS增強和規模：http://jsfiddle.net/dimitar/gNvvT/6/ - 如果不支持，你可以通過「.fade（）」來回退 –

我試圖讓一些行爲準確正如朱利奧所打算的那樣。它不使用CSS3轉換。然而，'destroy.delay（）'的有趣用法，從來沒有想過那麼容易清楚，'.delay（function（）{this.destroy（）;}。bind（））'XD –

回答