# code in desktop doesn't run on mobile help!

**URL:** <https://forum.wixstudio.com/t/code-in-desktop-doesnt-run-on-mobile-help/6287>\
**Category:** Ask the community\
**Tags:** code, question\
**Created:** [January 9, 2021, 11:27am UTC](https://forum.wixstudio.com/t/code-in-desktop-doesnt-run-on-mobile-help/6287 "2021-01-09T11:27:47Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![manuelapblanco](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/manuelapblanco/32/17227_2.png) [@manuelapblanco](https://forum.wixstudio.com/u/manuelapblanco)\
**Post date:** [January 9, 2021, 11:27am UTC](https://forum.wixstudio.com/t/code-in-desktop-doesnt-run-on-mobile-help/6287/1 "2021-01-09T11:27:47Z")

</div>

I’m using a very simple code to animate some text on my homepage but is not working on the mobile version, I’m a newbie in coding so I have no idea why.  
please help!

```javascript
$w.onReady(()=>{
 let sentence1 = $w('#text26')
 let sentence2 = $w('#text86')
 let sentence3 = $w('#text96')
 let myButton = $w('#button1')
 
    setTimeout(()=>{ sentence1.hide('fade'), sentence2.show('fade')},4000) 
    setTimeout(()=>{sentence2.hide('fade'), sentence3.show('fade')},8000) 
    setTimeout(()=> myButton.show('fade'),13000) 
}) 

```

---

<div class="post-metadata">

**Author:** ![mvveiga](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/mvveiga/32/122599_2.png) [@mvveiga](https://forum.wixstudio.com/u/mvveiga)\
**Post date:** [January 9, 2021, 11:38am UTC](https://forum.wixstudio.com/t/code-in-desktop-doesnt-run-on-mobile-help/6287/2 "2021-01-09T11:38:45Z")

</div>

The timeout first parameter is a callback function.  
Fix “;” instead “,”  
setTimeout (() =\> { sentence1 . hide ( ‘fade’ ); sentence2 . show ( ‘fade’ )}, 4000 )  
setTimeout (() =\> { sentence2 . hide ( ‘fade’ ); sentence3 . show ( ‘fade’ )}, 8000 )  
Insert {}  
setTimeout (() =\> {myButton . show ( ‘fade’ )}, 13000 )

Check the errors on the editor hovering the mouse on red dot in the code panel.

---

<div class="post-metadata">

**Author:** ![manuelapblanco](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/manuelapblanco/32/17227_2.png) [@manuelapblanco](https://forum.wixstudio.com/u/manuelapblanco)\
**Post date:** [January 9, 2021, 11:51am UTC](https://forum.wixstudio.com/t/code-in-desktop-doesnt-run-on-mobile-help/6287/3 "2021-01-09T11:51:13Z")

</div>

Hello! thank you for your help. 🙂  
I change the “;” buti had to delete the “Insert {}” part because and error popup.  
this is working fine on my desktop version my problems is that this doesn’t run on mobile, any idea why? or how can I make it work?  
this is how it looks now:

 ![](https://us1.discourse-cdn.com/wix/original/3X/5/7/57f7773d77a8be35839e83aafe1daaf2aeb157b3.png)

---

<div class="post-metadata">

**Author:** ![CODE-NINJA](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/code-ninja/32/110588_2.png) [@CODE-NINJA](https://forum.wixstudio.com/u/CODE-NINJA)\
**Post date:** [January 9, 2021, 6:16pm UTC](https://forum.wixstudio.com/t/code-in-desktop-doesnt-run-on-mobile-help/6287/4 "2021-01-09T18:16:48Z")

</div>

Back to the roots… 😁

[https://www.wix.com/velo/forum/community-discussion/fade-in-and-fade-out-multiple-objects-on-homepage](https://www.wix.com/velo/forum/community-discussion/fade-in-and-fade-out-multiple-objects-on-homepage)

---

<div class="post-metadata">

**Author:** ![manuelapblanco](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/manuelapblanco/32/17227_2.png) [@manuelapblanco](https://forum.wixstudio.com/u/manuelapblanco)\
**Post date:** [January 9, 2021, 8:03pm UTC](https://forum.wixstudio.com/t/code-in-desktop-doesnt-run-on-mobile-help/6287/5 "2021-01-09T20:03:24Z")

</div>

@russian-dima😂 im getting crazy,  
so yes, now is working fine on both desktop and mobile,

this code is giving the parameters to fade out my elements. and that’s fine.  
is there a code that can set up the fade in timing delay?  
wix just let me delay an animation for up to 8 sec.  
I mean… I need “#sentence86” to appear after 5 seconds of and “#text96” after another 5 seconds. because right now there’s no enough time to read the sentences. please help!

```javascript
$w.onReady(()=>{
 let sentence1 = $w('#text26')
 let sentence2 = $w('#text86')
 let sentence3 = $w('#text96')
 let myButton = $w('#button1')
 
    setTimeout(()=>{ sentence1.hide('fade'); sentence2.show('fade')}, 4000) 
    setTimeout(()=>{sentence2.hide('fade'); sentence3.show('fade')}, 8000)  
    setTimeout(()=> {myButton.show('fade')}, 13000)
 
}) 

```

---

<div class="post-metadata">

**Author:** ![CODE-NINJA](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/code-ninja/32/110588_2.png) [@CODE-NINJA](https://forum.wixstudio.com/u/CODE-NINJA)\
**Post date:** [January 9, 2021, 9:41pm UTC](https://forum.wixstudio.com/t/code-in-desktop-doesnt-run-on-mobile-help/6287/6 "2021-01-09T21:41:32Z")

</div>

@manuelapblanco  
Take a look here…  
[https://www.wix.com/velo/reference/$w/hiddenmixin/show](https://www.wix.com/velo/reference/$w/hiddenmixin/show)

You can set-up the " **delay**", " **duration**", " **direction**" and some other animation-options, like for example the " **intensity**" as you want.

For this, you set up “options” for every animation.

Let us take the —\> " **fade**"- **animation**.  
It has the following **OPTIONS** …

```javascript
let fadeOptions = {
  "duration": 2000,
  "delay": 1000
};

$w("#myElement").show("fade", fadeOptions);

```

As you can see, the FADE-ANIMATION has just 2-OPTIONS, which can be setted-up. Because it has for example → NO DIRECTION.

> **[show - Velo API Reference - Wix.com](https://www.wix.com/velo/reference/$w/hiddenmixin/show)**
>
> Shows the element and sets its hidden property to false, using an effect if specified. The show() function shows the element and returns a Promise that is ...

Now back to your EXAMPLE!

```javascript

// User-Interface-----------------------------------------
var fadeDURATION = 500
var fadeDELAY = 50
// User-Interface-----------------------------------------

$w.onReady(()=>{
  let fadeOptions = {
    "duration": fadeDURATION,
    "delay": fadeDELAY
  };
  
 let sentence1 = $w('#text26')
 let sentence2 = $w('#text86')
 let sentence3 = $w('#text96')
 let myButton = $w('#button1')
 
    setTimeout(()=>{ sentence1.hide('fade'); sentence2.show('fade')}, 4000) 
    setTimeout(()=>{sentence2.hide('fade'); sentence3.show('fade')}, 8000)  
    setTimeout(()=> {myButton.show('fade')}, 13000)
 
}) 

```

The same way you can EXPAND your ANIMATION-OPTIONS for every kind of ANIMATIONS!

CORRECTION: Sorry forgot something in the CODE!

```javascript
// User-Interface-----------------------------------------
var fadeDURATION = 500
var fadeDELAY = 50
// User-Interface-----------------------------------------

$w.onReady(()=>{
  let fadeOptions = {
    "duration": fadeDURATION,
    "delay": fadeDELAY
  };
  
 let sentence1 = $w('#text26')
 let sentence2 = $w('#text86')
 let sentence3 = $w('#text96')
 let myButton = $w('#button1')
 
  setTimeout(()=>{
      sentence1.hide('fade', fadeOptions); 
      sentence2.show('fade', fadeOptions)
  }, 4000) 
  
  setTimeout(()=>{
      sentence2.hide('fade', fadeOptions); 
      sentence3.show('fade', fadeOptions)
  }, 8000)  
  
  setTimeout(()=> {
      myButton.show('fade', fadeOptions)
  }, 13000)
}) 

```
