Jquery动画负顶部并返回0 - 第三次点击后开始混乱

Question

有问题的网站是这个：

http://www.pickmixmagazine.com/wordpress/

当您单击其中一个帖子（任何框）时，iframe 将从顶部向下滑动，其中包含内容。单击 iframe 左上角的“主页”按钮后，iframe 会向上滑动。这在前 2 次完美运行，在第 3 次点击帖子时，内容会向下滑动，但是当点击主页按钮时，内容会正常滑回，但一旦它一直滑动到它的位置应该在，iframe 会直接下降到单击主页按钮之前的位置，我再次单击它，然后它就可以工作了。

这是我用于上滑和下滑功能的代码：

/* slide down function */

var $div = $('iframe.primary');
var height = $div.height();
var width = parseInt($div.width());
$div.css({ height : height });
$div.css('top', -($div.width()));


$('.post').click(function () {
      $('iframe.primary').load(function(){
            $div.animate({ top: 0 }, { duration: 1000 });
      })

      return false;
 });


 /* slide Up function */

 var elm = parent.document.getElementsByTagName('iframe')[0];
 var jelm = $(elm);//convert to jQuery Element
 var htmlElm = jelm[0];//convert to HTML Element

 $('.homebtn').click(function(){
      $(elm).animate({ top: -height }, { duration: 1000 });

      return false;
 })

Answer 1

您是否考虑过在 jquery 中使用 Ajax，例如 load()、ready() 来更好地控制它们？

我也不确定你想用这个做什么。

var height = $div.height();
$div.css({ height : height });

也许你想得到当前窗口的高度？这种方式在哪里可以买到

var $dDiv = $('iframe.primary');
var innerH = window.innerHeight;
$dDiv.height(innerH);

同时尽量避免使用默认名称（如高度、宽度、div 等）命名您的自定义变量...您会混淆自己并使调试变得痛苦。