0

i have a botton which is for changing the background image with jquery, as the following code shows

$("#button").click(function() { 
  $('#div1').css("background-image", "url(images/newBG.jpg)");
});

it works very fine! but i want to fade in the newbg-image... is it possible to add a jquery fade method to it. Any help would be very appreciated. Thanks Ted

supersize
  • 13,764
  • 18
  • 74
  • 133
  • Check this answer : http://stackoverflow.com/a/5002651/1606729 – koopajah Jan 30 '13 at 19:42
  • Background images don't have an `opactiy` property, so this is not possible. If you really need that fade, you should use an actual `img` element instead. – Joseph Silber Jan 30 '13 at 19:42
  • No it's not possible to fade the background without fading the entire contents of the div. You could instead have a `absolutely` positioned `img` which you can then fade in/out. – Rory McCrossan Jan 30 '13 at 19:42
  • possible duplicate of [jquery: fade css background image change](http://stackoverflow.com/questions/5002351/jquery-fade-css-background-image-change) – j08691 Jan 30 '13 at 19:46

1 Answers1

0

Try this:

$("#button").click(function() { 
  $('#div1').hide().css("background-image", "url(images/newBG.jpg)").fadeIn(500);
});
Barlas Apaydin
  • 7,233
  • 11
  • 55
  • 86