javascript : domElement .fadeOut([duration],[callBack])

---

Target:

Applicable with any DOM element.

• getElementById
• getElementsByTagName
• getElementsByClassName
• getElementsByName
• querySelector
• querySelectorAll

---

Description :

Shows selected element/elements list with fade animation.
duration: optional if not passed then default is 300ms.
callBack:optional function executes when animation completes.

Note: if callBack function is passed then after animation callback method will initiate.

---

Syntax:

DOMElement.fadeOut([duration],[callBack])

DOMNodeList.fadeOut([duration],[callBack])

HTMLCollection.fadeOut([duration],[callBack])

---

Usase:

1. document.getElementById('firstDiv').fadeOut()
   it shows the div having id firstDiv with fade animation and return firstDiv element
2. document.getElementsByTagName('div').fadeOut()
   the getElementsByTagName selects all div and fadeOut() method shows all divs with fade animation and return getElementsByTagName result for further processing you do not need to execute selector again.
3. document.getElementsByClassName('FirstDiv').fadeOut()
   the getElementsByClassName selects all div having class "FirstDiv" and fadeOut() method shows all divs with fade animation and return getElementsByClassName result for further processing you do not need to execute selector again.
4. document.getElementsByName('FirstDiv').fadeOut()
   the getElementsByName selects all elements having name attribute "FirstDiv" and fadeOut() method shows all elements with fade animation and return getElementsByName result for further processing you do not need to execute selector again.
5. document.querySelector('.FirstDiv').fadeOut()
   the querySelector selects first div having class "FirstDiv" and fadeOut() method shows it with fade animation and return querySelector result for further processing you do not need to execute selector again.
6. document.querySelectorAll('.FirstDiv').fadeOut()
   the querySelectorAll selects all div having class "FirstDiv" and fadeOut() method shows all divs with fade animation and return querySelectorAll result for further processing you do not need to execute selector again.
7. document.querySelectorAll('.FirstDiv').fadeOut(3000)
   shows all div having class 'FirstDiv' aftet 3 seconds, smoothly with fade animation.
8. document.querySelectorAll('.FirstDiv').fadeOut(3000,function(){this.fadeIn(3000);})
   show all div having class 'FirstDiv' aftet 3 seconds, smoothly with fade animation and then passed callBack function executes.

Download MYJS.js

MyJs is a collection of java script extension methods that enhances the JavaScript objects, class object, DOM element, domElementsCollections, Date, String, Number and other data type. 

Include in you project landing page (master page) and it will extends your DOM and JavaScript Objects.