Fade Out on page

Ask the community
,
1

I’m new to Velo wix but i have created a site and need help adding “fade out” attribute to my landing page. I’ve referenced ADI resource and tried adding the following code both in the head in the custom code option via the dashboard and in dev mode via the editor but neither options seem to do the trick.

let fadeOptions = {
“duration”: 2000,
“delay”: 1000
};
$w(“#myElement”).hide(“fade”, fadeOptions);

Thanks for any help!

2

Hello miss Mitchell,

i do not see any starting sequence in your code, this could be the problem.

You can try to do it like this…

  1. First defining the “fade-options”
  2. Generate the “onReady”-function, which would be the start-sequence in your code, after page has been loaded.

I did not test this code-snipet, but normaly it should work for you. Try it out.

let fadeOptions = {
   "duration": 1000,
   "delay": 500
};

$w.onReady((=>{
    $w("#myElement").hide("fade", fadeOptions);
})
3

Below is a screenshot of what happens when preview to run the code. I’ll link me site if that helps https://www.zoepeds.com/
My goal is to have the landing page fade out into the following page.

1895×292 31.8 KB

Thanks!

4

@lmitchell
Ok, my bad. There was a typing-error in my code…
Please change from…

$w.onReady((=>{

…to…

$w.onReady(()=>{
5

@russian-dima its giving the message that hide is not a function.
Below is exactly what I entered. Am I typing something wrong?

842×213 15.1 KB

Thanks!

6

@lmitchell
You do everything right, execpt one thing. “PAGE” do not offer —> “show()” or “hide()”.
This code just works with ELEMENTS ON THE PAGE, not the page itself.

https://www.wix.com/velo/reference/$w/page

So what exactly are you trying to do ?
Perhaps you want to navigate to another page after a certain amount of time?