How do I add a background image to a page?

I want to add a background image to one of my knack pages. I only want it on that page.

I can style the knack-body with a background image, but it shows on all pages. How do I specify a specific page when applying a background image?

 

Thanks!

Not a JS expert can u see whats going wrong on this ? followed your code example

var _SceneId='scene_8'

$(document).on('knack-scene-render.any', function (event, page) {
if($("#"+_SceneId).is(":visible"))
{
$("body").css("background","url(http://www.web-wizard.net/images/file-folder.jpg)");
}
else
{
$("body").css("background","");
}
});

Hi Sunny,

This is a great solution, thanks. I am trying to add a background to the login page and this works great. However, I don't want the background to appear when the user logs in. I have also tried applying a background colour to the scene through CSS, but again, this is no use as the background image messes up the appearance of the home screen once they log in. 

If you or anyone else has come up against this and found a way around it, I'd be very grateful for your input please.

Regards,

Susanne.

Hello Jmena,

Try below code 

background: url(url) no-repeat; 

also we can use margin-left , right etc 

But we can't set Image size using code i think. First create exact image size you want .

 

Regards,

Sunny Singla

Hi Sunny,

Thanks for the code. I tried it and worked and I also applied to the header with similar results, but I am not sure what syntax to use in order to make the background image to occupy only the header area (position, repeat and/or size). Is this possible?

Thanks again.

thank you Sunny!

Thanks Sunny!

Excellent, that works Sunny

Hello Jason,

 

Please try below code in js editor 

var _SceneId='kn-scene_xyz'

$(document).on('knack-scene-render.any', function (event, page) {
if($("#"+_SceneId).is(":visible"))
{
$("body").css("background","url(imageurl)");
}
else
{
$("body").css("background","");
}
});

 

Change imageurl : to your background image 

kn-scene_xyz-> to your actual scene

 

Thanks,

Sunny Singla

ssingla1985@gmail.com

+919855089359