Different backgrounds for pages generated from for loop in one css
I got stuck with different background images I need for each page the ID
of which is generated from the following for loop statement:
`$`function nextButton() {
if(curNum<numScreens) {
curNum = parseInt(curNum)+1;
document.location.href = '#'+curNum;
$( init );
}
}
so I get /#1, /#2 and /#3 pages.
I tried to assign independent id/class for each page in html document like
that:
<body id="1">
<body id="2">
<body id="3">
and then in the css:
body.1 { background-image: url("bg.gif");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 53% 10%;
z-index: 1;
}
body.2 { background-image: url("bg1.gif");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 53% 10%;
z-index: 1;}
body.3 { background-image: url("bg2.gif");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 53% 10%;
z-index:1 }
but it does not work. Can you help me, please ?
No comments:
Post a Comment