Hi, how to create a random-background function, so every time I enter the website, the background is different? I am really missing option to so something with the background in WIX beside having a static photo or static video…
Have a look at Yisrael (Wix Admin) own Wix example site and you will find suitable examples that should help you, which you can open up in your own Wix Editor to see them all made up with code provided too.
https://www.grampsworkbench.com/Examples/Random-Image
https://www.grampsworkbench.com/Examples/Random-Gallery
If you use the search function too you will find posts about the same thing as well.
https://www.wix.com/corvid/forum/community-discussion/random-pic-homepage
But this is only for an image. I want to have background. Full size - responsive (in X and Y). Like here:
http://adept.dk
Yes so set it for a background then.
https://www.wix.com/corvid/reference/$w.Background.html
But where exactly in the code?
-
import wixWindow from ‘wix-window’;
-
import wixData from ‘wix-data’;
-
$w.onReady( async function () {
-
// Check the render env so this is just done once.
-
// Otherwise, server-side will render, and then the image
-
// switches to the image that the client-side rendered.
-
if (wixWindow.rendering.env === ‘browser’ || wixWindow.viewMode === ‘Preview’) {
-
let res = await wixData.query(“HomepageImages”).find();
-
let items = res.items;
-
let count = items.length; // how many images do we have?
-
let rnd = Math.floor(Math.random() * count);
-
$w(’ #image1 ').src = items[rnd].image; // get a random image
-
$w(’ #image1 ').show(); // image on page is hidden, we we now show it
-
}
-
});
When I try to import the background from #page1, it says that there is no such thing:
l
et backgroundOpts = $w(“#myElement”).background;
let bgSrc = backgroundOpts.src;
Result:
“‘background’ does not exist on Page1”.
@zbierajarch Try this:
$w(“Document”).background.src = < your background image URL >;
@yisrael-wix Thank you, it works! BUT, the image is tiled. Is it possible to get the images to be responsive like they would be in normal backgrounds? (full width & height)
How do I do this?
I have 0 experience with coding, and I’m using datasets for this btw.
What do I change in the code?
Please realize that you can’t just “copy and paste” code and expect it to work. You need to understand what’s happening if you expect to be able to write code that does what you want.
To learn about programming with Corvid, read the following articles that will help you start working with Corvid:
-
About Corvid by Wix - what Corvid is and what features it has.
-
Getting Started with Corvid by Wix - step-by-step tutorial on how to start using Corvid.
-
Onboarding to Corvid by Wix - introduction to Corvid with short tutorials.
If you find that you are having difficulty with code and need assistance, you may want to check out the Wix Marketplace - it’s a place where you can look for Corvid experts for hire.
This is an old post and will be closed.