jQuery高度更改在Safari中不起作用

Question

我在以下网站上有一个JS功能，它在Firefox中运行得很好，但在Safari中运行不好：http://rossbolger.com/kids/light-stories/

当鼠标悬停在名为#hit area的容器上时，该功能会滑出一个名为#image thumbs的缩略图网格。它的工作原理（至少在Firefox中）是首先将#image_thumbs的高度从"48px"更改为"auto"，然后使用jQuery的height（）测量高度。这个高度存储在一个变量中，然后使用jQuery的css（），当鼠标悬停时，它会返回给#image拇指。

网站上的代码看起来有点像这样：

// Thumbnails Nav Reveal and Hide Scripts
var thumbs_height = 1,
thumbs = $('#image-thumbs'),
thumbs_original_height = thumbs.css('height');
// Slide Up Thumbs
(function revealThumbs() {
    // On hover let the thumbs become their full height
    $('#image-thumbs #hit-area').hover(function(){ // Mouse over
        // Get the unrestricted height of the thumbs
        thumbs.css('height', 'auto');
        thumbs_height =  thumbs.height();
        // then put it back to what it was so we can animate it using CSS3 transition
        thumbs.css('height', 'inherit');
        // delay 0.1s before triggering the change in height (time for the calculations to complete)
        setTimeout( function() { thumbs.css('height', thumbs_height ) }, 100 );
    }, function(){ // Mouse out
        hideThumbs();
    });
})();
// Hide thumbs
function hideThumbs(){
    thumbs.css('height', thumbs_original_height );
};

测量不受限制的高度并将其作为像素值返回，而不是简单地将高度设置为"自动"，是为了通过CSS3创建滑动效果（即转换：高度0.5s）。只有当受影响的属性从一个数值变为另一个数值时，才会发生转换。

感谢您对bug测试的帮助。我甚至还没有看过其他浏览器。

祝你一切顺利，Laurence

Answer 1

好吧，我已经解决了。。。

在javascript文档（网站上的scripts.js）中，页面上方有一个函数调用hideTumbs（）函数。所以它不起作用，因为当时hideTumbs（）中的变量还没有声明。有趣的是，它仍然可以在Firefox和IE9中工作！

我已经将所有这些代码移到了另一个函数之前的某个点，现在问题已经解决了到目前为止，我只在当地做过这件事。我稍后会在上面的链接中更新网站