Question

<>Hi guys,

我说,我很新,可以 j。我写了一幅非常简单的文字,如果屏幕分辨率大于1028px,就增添了背景形象。

不幸的是,在试图使用这台计算机(通过800x600分辨率)后,它就没有工作。

我不想夸大形象,只是说如果屏幕分辨率大于或等于1024。

该守则是:

    <SCRIPT language="JavaScript">
    <!--
    document.write( <style type="text/css">div#container_header_body {background-image:url(  );
    if (screen.width<1024)
    {
     document.write( none; );
    }
    else
    {
      document.write( images/mmmgirl.png );
    }
    document.write(  );</style> );
    //-->
    </SCRIPT>

<link rel="stylesheet" type="text/css" href="stylesheet.css" />

Can anybody give me some insight into what I m doing wrong?

Thanks so much. I ve already learned a LOT from this place.

<>----><>>>

Answer 1

Try this jsfiddle:

var screenWidth = screen.width,
    container = document.getElementById( container_header_body );

console.log(screenWidth);

if (screenWidth > 1024) {
     container.style.backgroundImage =  url(http://oddanimals.com/images/lime-cat.jpg) ;
} else {
    container.style.backgroundImage =  none ;
}

Answer 2

No need for JavaScript, just use a CSS media query:

@media all and (min-width: 1024px) {
    background-image: url(images/mmmgirl.png);
}

友情链接