I am using Sitecore 8.2 and I am working with the RenderingModel. I have a template field called "Header Image" that I would like to render on my Layout. Here is the css

.microsite-banner{
            background: url(../images/trees_banner_2.jpg)  no-repeat center fixed; 
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            background-attachment: scroll;
            position: relative;
            
        }

Here is my markup:

 <div id="banner-nav-container" class="microsite-banner">

          <div class="home-banner-overlay"> </div>

          <div class="clearfix"></div>

          <div style="width: 100%;position:relative;">

and here is the code I thought might swap out the css image

 <script>

        
        $('.microsite-banner').css("background", "url(@Html.Sitecore().Field("Header Image")");

    </script>