0

I've tested the website that I am currently developing now on different browsers. It looks all fine until Safari misbehaves and doesn't load the background-image that I have coded.

The other browsers that I have tested, are working fine.

I'm thinking that maybe the code that I have used isn't compatible with Safari. If you have any tricky way to declare a background-image using JavaScript, please teach me.

$("#homebtn1").click(function() {
  $("#home").css({"background-image":"url(images/New/17.jpg)","background-position":"center"});
})

$("#homebtn2").click(function() {
  $("#home").css({"background-image":"url(images/New/18.jpg)","background-position":"center"});
})

$("#homebtn3").click(function() {
  $("#home").css({"background-image":"url(images/how.jpeg)","background-position":"center"});
})

Sample pictures of Safari Image Error

Chrome Safari

Deepak gupta
  • 504
  • 1
  • 6
  • 22
Pablo
  • 1,357
  • 1
  • 11
  • 40

1 Answers1

1

Try adding the background property

   background-size: cover;

Or in jQuery

 "background-size":"cover",

That might make it work.

Hope this helps. :)

waz
  • 1,165
  • 16
  • 31