Animated background color - Forum

Forum Navigation
Climate strike banner
You need to log in to create posts and topics.

Animated background color

This is a very nice effect:

  1. Go to Project > Properties > Styles
  2. Paste this code:
    @keyframes color-change-2x {
      0% {
        background: #19dcea;
      }
      100% {
        background: #b22cff;
      }
    }
    .dynamic-color {
     -webkit-animation: color-change-2x 2s linear infinite alternate both;
             animation: color-change-2x 2s linear infinite alternate both;
    }
  3. Click on the Container and go to the Properties panel on the right.
  4. In Advanced > CSS-class choose "dynamic-color" and Run your App.

Note that you can customize the colors.

Cool effets Luis!  Thanks.

I have got some problem to understand what you mean by going to Project - Properties-Styles, because that can be done by clicking on the canvas window, than properties, than style, but this way I couldn't paste the code you supply.

If you would had say Project (Menu), Properties, Styles, I would find my way home right away.

Sorry I'm a New Kid on the Block with VisualNEO Web and also the interface is also new for me.

After teaching about 25 years, I discovered that "one word" can make all the difference.

But you know what, after trying the code, you are right, it is really cool effets!

Oh by the way, is there a way to have a fix size of the app after compiled?  I mean, that the user can't resize the window app.

Roger :)

Hi @rocote, sorry you are right!

Oh by the way, is there a way to have a fix size of the app after compiled? I mean, that the user can't resize the window app.

Do you mean when compiled as .exe?
Go to Project (Menu) > Properties > Platform Options > Desktop
Uncheck the "sizeable" option.

Let me know if that works for you.

 

 

Yes when compiled.  I didn't experiment the options into the project menu.  There is a lots of them that are important.

Thanks for your patience and fine answer.  This is what I was looking for.

Roger