你如何切换背景:url' s?

时间:2016-11-14 21:12:58

标签: javascript jquery css toggleclass

我使用Todd Moto的flaunt.js进行导航,想要将汉堡包图像与其他图像切换,然后在移动菜单显示和关闭时再次切换。

演示在这里:

https://toddmotto.com/labs/flaunt-js

教程在这里:

https://toddmotto.com/flaunt-js-for-stylish-responsive-navigations-with-nested-click-to-reveal

1 个答案:

答案 0 :(得分:2)

是的,有很多方法可以更改CSS背景图像。你可以直接设置它。

示例:

HTML:<div id='my-box'></div> CSS:

#my-box {
    height: 518px;
    width: 800px;
}

JS:

document.querySelector('#my-box').style.backgroundImage =
    'url(' +
    'https://www.thebigduck.us/content/themes/big-duck/dist/images/dp03_v2.jpg' +
    ')';

小提琴:https://jsfiddle.net/jmz20uhy/