background image is not changing using jquery on IE 11

Question

Dears am trying to change div background-image using jquery on click as shown in code below its working on all browsers except IE.....help please

<div id="section1" class="section111">
        <div class="container">
            <div style="width: 100%; z-index: 999999999;" class="ServicesTitle">
                <p class="Main_TitaleServices">SERVICES & SOLUTIONS</p>
                <p class="slogan">Full Solutions for a Perfect Business   </p>
            </div>
            <div id="title-underline" style="margin-bottom: -30px;">
                <img src="../../App_Themes/ThemeEn/Images/title-underline.png">
            </div>
            <div class="firstrow">
                <div class="col-lg-3 divServices ">
                </div>
                </div>

        </div>
    </div>

here is the script

<script>
$(function () {
$("#WebsiteDevelopment").click(function () {
    $("#section1").css("background-image", "url(/App_Themes/ThemeEn/Images/webdevelopment.jpg !important")
    /

});
$("#btnWebsiteDevelopment").click(function () {


    $("#section1").css("background-image", "url(/App_Themes/ThemeEn/Images/section1bg.png")

});
});
</script>

Possible duplicate of [dynamically switching 'background-image' doesn't work in IE](https://stackoverflow.com/questions/3205110/dynamically-switching-background-image-doesnt-work-in-ie) — Julien Mellerin, Jul 08 '17 at 10:14
Possible duplicate of [How to set background image in html that work in Internet explorer?](https://stackoverflow.com/questions/19449185/how-to-set-background-image-in-html-that-work-in-internet-explorer) — Shiladitya, Jul 08 '17 at 10:17

Ankit Agarwal · Accepted Answer · 2017-07-08T10:27:15.057

0

Try setting background instead of background-image.

<script>
$(function () {
$("#WebsiteDevelopment").click(function () {
    $("#section1").css("background", "url(/App_Themes/ThemeEn/Images/webdevelopment.jpg !important")
    /

});
$("#btnWebsiteDevelopment").click(function () {


    $("#section1").css("background", "url(/App_Themes/ThemeEn/Images/section1bg.png")

});
});
</script>

Or use pure javascript approach,

document.getElementById('section1').backgroundImage = "url('url(/App_Themes/ThemeEn/Images/webdevelopment.jpg !important')";

edited Jul 08 '17 at 10:27

answered Jul 08 '17 at 10:13

Ankit Agarwal

30,378
5
37
62

Dear AKA, I tried using background but stil not working – Mohammad Aldaqqouri Jul 08 '17 at 10:23
I have updated the answer. Use the second one with javascript fix. – Ankit Agarwal Jul 08 '17 at 10:27
Glad to help you. – Ankit Agarwal Jul 08 '17 at 10:43

background image is not changing using jquery on IE 11

1 Answers1