Hi I currently have a aspx user control that pulls an image from umbraco and displays it as a inline background image overriding the default image that Is set in the css file.

It will display the default css image when an image has not been selected in umbraco.

I am trying to set it up so that when a screen size hits a certain breakpoint a different image displays from one selected In umbraco.

Here is the code used to display the image, along with the html code. Is there anyway I could do an IF Statement on this line of code, something along the lines of

IF (@mediaquery > 1000px)
{
sb.Append(string.Format("<header {0}>", ImageUrl != string.Empty ? "style='background: url(" + ImageUrl + ") no-repeat'" : string.Empty));
}
else
{
sb.Append(string.Format("<header {0}>", ImageUr2l != string.Empty ? "style='background: url(" + ImageUrl2 + ") no-repeat'" : string.Empty));
}

I just am unable to figure out how to get the current screen size(media query) at the user control level.

Any help or guidance would be much appreciated!

// CODE

        var umbracoHelper = new UmbracoHelper(Umbraco.Web.UmbracoContext.Current);
        StringBuilder sb = new StringBuilder();

        var currentNode = umbracoHelper.AssignedContentItem;

        string ImageUrl = GetUmbracoImageUrlFromProperty(currentNode, "Image");
        string Text = GetUmbracoPropertyAsString(currentNode, "Text");
        string headerSubText = GetUmbracoPropertyAsString(currentNode, "SubText");


        sb.Append(string.Format("<header {0}>", ImageUrl != string.Empty ? "style='background: url(" + ImageUrl + ") no-repeat'" : string.Empty));
        sb.Append("<div class='container'>");
        sb.Append("<div class='row'>");
        sb.Append("<div class='col-lg-12 intro-text'>");
        sb.Append("<h1>");
        sb.Append(Text);
        sb.Append("</h1>");
        sb.Append("<h1 class='w300'>");
        sb.Append(SubText);
        sb.Append("</h1>");
        sb.Append("<hr />");
        sb.Append("</div>");
        sb.Append("<div id='down-arrow'>");
        sb.Append("<img src='/images/down-arrow.png' />");
        sb.Append("</div>");
        sb.Append("</div>");
        sb.Append("</div>");
        sb.Append("</header>");

        litHomePageHeadings.Text = sb.ToString();