JavaScript
How to make Select All with single check box in jQuery?
How to make Select All with single check box in jQuery. $(document).ready(function () { $(‘#selecctall’).click(function (event) { //on click if (this.checked) { // check select status $(‘.check’).each(function () { //loop through each checkbox this.checked = true; //select all checkboxes with class “checkbox1” }); } else { $(‘.check’).each(function () { //loop through each checkbox this.checked = […]
Fundamentals of Web Design
Designing a web site needs careful thinking and planning. The most important thing is to KNOW YOUR AUDIENCE. Users are Scanners A typical visitor will NOT read the entire content of your Web page! No matter how much useful information you put into a Web page, a visitor will only spend a few seconds scanning […]
Sorting HTML table using jQuery Table Sorter plugin
Our goal is to just provide client side table data sorting so we will use table sorter jQuery plugin. All you need to do is to include table sorter jquery plugin in your code and call the table sorterfunction. Below is the single line code which lets you do this. Download Demo : https://github.com/christianbach/tablesorter $(document).ready(function (){ […]
How to load more than one version of jQuery?
Well it is not recommended to use multiple version of jquery. One must use only the latest version of jquery. Reason of using latest version is New added features, bug fixes old version and at last performance. However, it’s not always possible to upgrade as soon as a new version comes out. New version may […]
How to use AngularJS Expressions?
AngularJS expressions are written inside double braces: {{ expression }}. AngularJS expressions binds data to HTML the same way as the ng-bind directive. AngularJS will “output” data exactly where the expression is written. AngularJS expressions are much like JavaScript expressions: They can contain literals, operators, and variables. Example {{ 5 + 5 }} or {{ […]
Ajax Image upload Previewer
Please select some picture from your computer, It would display the picture you selected. The file is edited so that can upload muiti picture. Reference from Kamyar Nazeri in StackoverFlow http://stackoverflow.com/questions/14069421/in-html5-how-to-show-preview-of-image-before-upload Download Demo example Click Here
How to Create Carousels with Bootstrap 3
Creating Carousels with Bootstrap The carousels popularly known as slide shows are some of the best ways of showcasing huge amount of contents within a small space on the web pages. It is a dynamic presentation of contents where text and images are made visible or accessible to the user by cycling through several items. […]
Html marquee : stop() and start() work on firefox 26 but not on 27 and higher
<marquee onMouseOver=’this.stop();’ OnMouseOut=’this.start();’>Hello</marquee> Not working Why? Use below method <marquee onMouseOver=”this.setAttribute(‘scrollamount’, 0, 0);” OnMouseOut=”this.setAttribute(‘scrollamount’, 6, 0);”>Hello</marquee> This works in Firefox 27.0.1 which is the version I tested it on. It may be useful for you to read the following on the marquee element. As it is a non-standard element, support over each browser will vary […]
Stopping & Starting HTML Marquees
This example allows the user to stop the marquee when they hover over the marquee with their cursor (i.e. onmouseover). The marquee then continues when the user hovers away from the marquee (i.e. onmouseout). <marquee behavior=”scroll” direction=”left” onmousedown=”this.stop();” onmouseup=”this.start();”>Click Here and hold the mouse marquee stop</marquee> <p><a href=”https://kumarsher45.wordpress.com/”>Marquee Start/Stop</a></p> <!– Marquee Start/Stop by My Life […]
How to fix position of DOM element on scroll?
How to fix position of DOM element on scrolling window 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 $(document).scroll(function() { var x=$(document).scrollTop(); if(x>=30) { document.getElementById(“fix”).style.position=”fixed”; document.getElementById(“fix”).style.top=”0px”; document.getElementById(“fix”).style.zIndex=”120″; } else { document.getElementById(“fix”).style.position=”relative”; document.getElementById(“fix”).style.top=”auto”; } });
Keep Learning 