javascript : DomElement .fadeIn([duration],[callBack])
javascript : DomElement .fadeIn([duration],[callBack])
Target:
Applicable with any DOM element.
- getElementById
- getElementsByTagName
- getElementsByClassName
- getElementsByName
- querySelector
- querySelectorAll
Description :
hide 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.fadeIn([duration],[callBack])
DOMNodeList.fadeIn([duration],[callBack])
HTMLCollection.fadeIn([duration],[callBack])
Usase:
- document.getElementById('firstDiv').fadeIn()
it hides the div having id firstDiv with fade animation and return firstDiv element - document.getElementsByTagName('div').fadeIn()
the getElementsByTagName selects all div and fadeIn() method hides all divs with fade animation and return getElementsByTagName result for further processing you do not need to execute selector again. - document.getElementsByClassName('FirstDiv').fadeIn()
the getElementsByClassName selects all div having class "FirstDiv" and fadeIn() method hides all divs with fade animation and return getElementsByClassName result for further processing you do not need to execute selector again. - document.getElementsByName('FirstDiv').fadeIn()
the getElementsByName selects all elements having name attribute "FirstDiv" and fadeIn() method hides all elements with fade animation and return getElementsByName result for further processing you do not need to execute selector again. - document.querySelector('.FirstDiv').fadeIn()
the querySelector selects first div having class "FirstDiv" and fadeIn() method hide it with fade animation and return querySelector result for further processing you do not need to execute selector again. - document.querySelectorAll('.FirstDiv').fadeIn()
the querySelectorAll selects all div having class "FirstDiv" and fadeIn() method hides all divs with fade animation and return querySelectorAll result for further processing you do not need to execute selector again. - document.querySelectorAll('.FirstDiv').fadeIn(3000)
hides all div having class 'FirstDiv' aftet 3 seconds, smoothly with fade animation. - document.querySelectorAll('.FirstDiv').fadeIn(3000,function(){this.fadeOut(3000);})
hides 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.
Comments
Post a Comment