Question

我有一个div隐藏，直到页面加载。一旦页面加载带有转换的div节目。它在Firefox中有效但在chrome中它只是停止显示。

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

http://raulmv.com

问题应该是CSS，但它似乎是一个棘手的问题。

由于

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

更新溶液

最后由于某种原因，我必须以这种方式更新脚本</ p>

而不是：

<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>

我不确定原因，但它现在适用于所有浏览器。

Answer 1

尝试将您的过渡更改为您的班级：悬停并添加：

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

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

}

并删除悬停的转换。

也许它没有短形式。

（bouth适用于Chrome最新版本）

页面加载后转换未在chrome中显示

1 个答案: