custom Loading Spinner image in Lightning Component -- w3web.net

How to Show/Hide a Custom Loading Spinner Image in Salesforce Lightning Component

Hey guys, today in this post we are going to learn about how to show and hide a “Custom Loading Spinner Image” as Clint Side in Salesforce Lightning Component.

Files we used in this post example:-

spinnerCustomApp.app Lightning Application It is used for call the component to preview on browser.

spinnerCustomCmp.cmp

Lightning Component It is used for create a spinner button and modal popup for display a spinner image.

spinnerCustomCmpController.js

JavaScript Controller File It is used for click button function for show and hide the custom loading spinner image.
spinnerCustomCmp.css Component Style CSS It is used for create custom Style CSS for display the spinner image at middle of the page.

Live Demo

custom spinner in lightning component -- w3web.net

Other post that would you like to learn…

Step 1:- Create Lightning Application : spinnerCustomApp.app

From Developer Console >> File >> New >> Lightning Application

spinnerCustomApp.app [Component Application File]

Step 2:- Create Lightning Component : spinnerCustomCmp.cmp

From Developer Console >> File >> New >> Lightning Component

spinnerCustomCmp.cmp [Lightning Component File]

Step 3:- Create Lightning Component : spinnerCustomCmpController.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Controller

spinnerCustomCmpController.js [JavaScript Controller]

Step 4:- Create Lightning Component Style: spinnerCustomCmp.css

From Developer Console >> File >> New >> Lightning Component >> Component Style CSS

spinnerCustomCmp.css [Style CSS]


custom spinner image in lightning component -- w3web.net

Further post that would you like to learn

2 thoughts on “How to Show/Hide a Custom Loading Spinner Image in Salesforce Lightning Component”

Leave a Comment

Contribute to Support If Some Value Added in Your Project or Website