. Rising Code Challenges Skip to main content

Posts

Showing posts from September, 2016

How works ng-hide and ng-show in angular js

Angualrjs is the most popular js framework today. This is widely used in develop Mobile apps by using phonegap.  And also angular js used  in website. AngularJS lets you extend HTML vocabulary for your application. The resulting environment is extraordinarily expressive, readable, and quick to develop. ng-show The ngShow directive shows or hides the given HTML element based on the expression provided to the ngShow attribute. The element is shown or hidden by removing or adding the .ng- hide CSS class onto the element. The .ng-hide CSS class is predefined in AngularJS and sets the display style to none (using an !important flag). For CSP mode please add angular-csp.css to your html file. ng-hide The ngHide directive shows or hides the given HTML element based on the expression provided to the ngHide attribute. The element is shown or hidden by removing or adding the ng-hide CSS class onto the element. The .ng-hide CSS class is predefined in AngularJS and sets the display style to no...

Hide show HTML element by javascript

Hide show any element on a HTML page is vary common thing for websites. For Hide and Show elements Jquery is the most common and reliable framework. But There is some performance issue by jquery, so Javascript is the best solution for Hide and show any element on a web page. Sometimes JQuery isn't necessary; if this is the only thing you need to do on a page, the overhead of loading the library far outweighs the need to write concise JavaScript. It seems that hide() , show() and jquery visibility methods in general are not a good option in terms of performance. Hide an element by id  in Javascript: [code language="js"] document.getElementById("id").style.display = "none"; [/code] Hide an element  by id  in jquery: [code language="js"] $("#id").hide(); [/code] Hide an element by class in javascript : [code language="js"] document.getElementsByClassName("class")[0].style.display = "none"; [/code] Hide el...