CSS or Javascript - display fallback text if background image not loaded [duplicate]

Answer 1

Try it this way:

HTML

  
this text should be displayed if bg image is not loaded

CSS

.iHaveBgImage { background-image:
url('https://s31.postimg.org/yqv51r5xn/6936671_hd_wallpapers_for_ipad.jpg');
color:red;
}

.iHaveBgImage > p {
  position: relative;
  z-index: -1;
}

Works perfectly https://jsfiddle.net/s0gt2eng/