平滑的背景图像过渡 - Javascript

本文介绍了平滑的背景图像过渡 - Javascript的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 http://www.chooseyourtelescope.com/ （>>该网站尚未完全响应，所以请注意它至少在15''的屏幕上，否则你不会看到我在说什么） 当你徘徊按钮（月球，星球等...... ）它改变了背景。但Chrome的过渡是错误的（image1> blank> image2）。它在IE11上工作，但有时会有滞后。我没有尝试过其他浏览器。 如何通过快速淡化实现平滑过渡？ Image1> image2，而不是image1> ;过渡颜色> image2 这是MOON按钮的代码。这和其他人一样。 （我对Javascript一无所知。我在Stackoverflow上找到了下面的脚本。） ** HTML ** < div class = top-logos-home id = top-logos-moon-front > < img src = moon-logo.png alt = MOON > < / div > ** CSS ** 。 image -home { position ： 绝对; width ： 100％; height ： 100％; background-image ： url（Frontpage.jpg）; background-size ： 封面; 显示 ： 内联; top ： 0; } * * JAVASCRIPT ** jQuery（ function （）{ var $ body = $（' 。image-家）; $（' ＃top-logos-moon-front'）。悬停（ function （）{ $ body.css（' background-image'，' url（Frontpage-moon.jpg）'） }， function （）{ $ body.css（' background-image'，' '）}）}） 解决方案 这篇关于平滑的背景图像过渡 - Javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！