Try it as below: If you want it specifically on homepage, insert the below code in `script editor/content editor webpart`. But if you want it for entire site collection, add it in the custom css file referred in masterpage or on the masterpage itself. #s4-workspace { background:url('../Style Library/Images/bg.png') no-repeat center center fixed; } or as below: body.ms-backgroundImage { background: url('../Style Library/Images/bg.png') no-repeat center center fixed; } **Edit 2 :** As per your comments, you want it for a specific section. Try it as below: 1) Edit your page by clicking on gear icon in top right. [![enter image description here][1]][1] 2) Click on Add webpart. After doing that, click on the Script editor webpart and then click OK as below: [![enter image description here][2]][2] 3) I have selected Script editor webpart. Inside the webpart, add the below code snippet. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="https://sitecollectionurl/siteassets/parallax.min.js"></script> <style> .parallax-window { min-height: 400px; background: transparent; } </style> <div class="parallax-window" data-parallax="scroll" data-image-src="https://sitecollectionurl/SiteAssets/Instant%20Intranet/Theme%20Two/images/rapidcircle.png"></div> 4) Once that is done, click on Save. Checkin and publish the page. And there you have parallax for a specific section as below: [![enter image description here][3]][3] You need to change the path to that of your site collection. [1]: https://i.sstatic.net/Gm4mz.png [2]: https://i.sstatic.net/SQ1o8.png [3]: https://i.sstatic.net/vlQUp.png