E.Owen E.Owen - 19 days ago 5
CSS Question

How do I set background-image height using jQuery?

I would like my background image to fill the height of the window on which it is being viewed. Obviously I don't know this value since it is variable. I know it is possible to do what I want using jQuery but after searching SO and google for about an hour without finding an answer to my question, I gave up and decided to ask instead.

I have the background image set to cover it's containing

<div>
using css.

How do I achieve my desired outcome?

Answer

Using Jquery background image according to window height See the snippet

  

$(document).ready(function () {
     var winHeight = $(window).height();
     $('.window-height-bg').css('height', winHeight + 'px');
});
   

 body{
      margin:0px;
     }
    .window-height-bg {
       width:100%;
       background:red url(http://i67.tinypic.com/2mqj1iq.jpg) no-repeat;
       background-size:100% 100%;
    }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="window-height-bg">
</div>