38

Fade In/Out Electron Window - Victor Aremu - Medium

 3 years ago
source link: https://medium.com/@victoraremu/fade-in-out-electron-window-6d81c5eaf835
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Responses

You have 2 free member-only stories left this month.

Fade In/Out Electron Window

Today we will cover how to fade in and out electron browser window to achieve some cool looking effect. We will write some functions do this in Electron’s renderer process.

Let’s start out by writing the function that fades In a browser window:

fadeWindowIn — A function that fades in a given browser window.

Writing a fadeOut function writing inverse of our fade In logics:

fadeWindowOut — A function that fades out a given browser window.

Now that we have both functions, using them goes like this:

Usage of both fadeWindowOut and fadeWindowIn function.

Bonus

Let’s say for some reason we want to stop fading at will. Since both fadeWindowIn and fadeWindowOut method returns a time identifier, we can use this to cancel the interval at will using the clearInterval function.

Stop fading at will.

I have set up and an Electron Fiddle for demo purpose 👇https://gist.github.com/757e9afce3b6bd97f2b024b787653dfe

Image for post
Image for post
A demo, beautiful init?

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK