Properti style.backgroundPosition digunakan untuk mengatur posisi BACKGROUND atau BACKGROUND-IMAGE.
Sintaks:
obj.style.backgroundPosition = value;
Nilainya:
- Length
- Keywords
left top
left center
left bottom
center top
center center
center bottom
right top
right center
right bottom
inherit
Contoh 1:
<HTML>
<HEAD>
<TITLE>style.backgroundPosition</TITLE>
</HEAD>
<BODY>
<SCRIPT TYPE="text/javascript">
var bodyElem = document.getElementsByTagName("body")[0];
bodyElem.style.backgroundImage = "url(picture.gif)";
bodyElem.style.backgroundRepeat = "no-repeat";
bodyElem.style.backgroundPosition = "center center";
</SCRIPT>
</BODY>
</HTML>
Contoh 2:
<HTML>
<HEAD>
<TITLE>style.backgroundPosition</TITLE>
<STYLE TYPE="text/css">
body
{
background: url(picture.gif) no-repeat;
}
</STYLE>
<SCRIPT TYPE="text/javascript">
function changePosition()
{
var list = document.forms[0].listPositions;
document.body.style.backgroundPosition = list.options[list.selectedIndex].text;
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<SELECT NAME="listPositions" onChange="changePosition()">
<OPTION SELECTED>left top
<OPTION>left center
<OPTION>left bottom
<OPTION>center top
<OPTION>center center
<OPTION>center bottom
<OPTION>right top
<OPTION>right center
<OPTION>right bottom
</SELECT>
</FORM>
</BODY>
</HTML>