0

我有一个隐藏到页面加载的 div。一旦页面加载了带有过渡的 div 显示。它在 Firefox 中有效,但在 chrome 中它只是停止显示。

这是链接,因此您可以在 Firefox 和 Chrome 中尝试并查看差异。

http://raulmv.com

问题应该出在 CSS 上,但它似乎是一个棘手的问题。

谢谢

哦,是的,我忘了说它可以在我的本地使用 Chrome。我觉得这很奇怪。

更新 解决方案

最后由于某种原因我不得不以这种方式更新脚本

而不是这个:

<script>  
$(document).ready(function() {
  setTimeout(function() {
  $('.slider').css('visibility', 'visible');
  $('.slider').css('opacity', '1');
  $('.slider').css('max-height', '4000px');
  $('.slider').css('-webkit-transition', 'all 2s linear');
  $('.slider').css('transition', 'all 2s linear');//notice this line
    },3000);
});
</script>   

我不得不使用这个:

<script>  
$(document).ready(function() {
  setTimeout(function() {
  $('.slider').css('visibility', 'visible');
  $('.slider').css('opacity', '1');
  $('.slider').css('max-height', '4000px');
  $('.slider').css('-webkit-transition', 'all 2s ease-in-out');
  $('.slider').css('transition', 'opacity 2s ease-in-out, max-height 2s ease-in-out');//This is the line I changed
    },3000);
});
</script>  

我不确定为什么,但它现在适用于所有浏览器。

4

1 回答 1

0

尝试在 :hover 之前将您的过渡更改为您的班级并添加以下内容:

#clickme_about, #clickme_work, #clickme_interests, #clickme_find_me {

transition-duration: 0.4s;
transition-property: color;

}

并从悬停中删除过渡。

也许它可以在没有简短形式的情况下工作。

(在 chrome 最新版本上都适用于我)

于 2013-10-11T20:29:24.750 回答