Cristian Boariu
Cristian Boariu

Reputation: 9621

why multiple background images does not work for IE?

I have this code which works nice in Chrome and Firefox, but on IE only the second background image appears... Do you know why?

    $('input[type=button]').click(function() {
    //search for the button
    var button = document.getElementsByName("contactme");
    //change the image
    button[0].style.background = "url(http://www.restorationsos.com/imgs/loader.gif) no-repeat,  url('http://www.restorationsos.com/imgs/btnBG.gif') repeat-x";
    //change the text
    button[0].value = "We Are Connecting You...";
    button[0].style.textAlign = "right";
    button[0].style.color = "#ea2400";
    //disable the button
    button[0].disabled = true;
});

Live: http://jsfiddle.net/cristiboariu/pUeue/21/

Upvotes: 0

Views: 465

Answers (2)

thirtydot
thirtydot

Reputation: 228162

It's simple:

Only IE9+ supports multiple backgrounds images, see:

http://caniuse.com/#search=multiple%20backgrounds

Upvotes: 2

locrizak
locrizak

Reputation: 12281

Try adding the css property

zoom:1;
In IE7 this makes the background image magically appear. Don't ask me why, it just does.

Upvotes: 0

Related Questions