<!DOCTYPE html>
<html>
<style>
body {
background: #f3f3f3 url('img_tree.png') no-repeat right top;
}
</style>
<body>
<h1>HTML Style Object</h1>
<h2>The backgroundAttachment Property</h2>
<p>Scroll the page before and after you have clicked the button.</p>
<p>Try to to resize the window if the scrollbar is not available.</p>
<button onclick="myFunction()">Set background image to be fixed</button>
<br>
<script>
function myFunction() {
document.body.style.backgroundAttachment = "fixed";
}
</script>
<p>Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..
<br><br><br><br>
Some text to enable scrolling..