Get current Mouse pointer coordinates using JQuery

$(document).ready(function() {
	$(document).mousemove(function(e)
	{
		console.log( "X : " + e.pageX );
		console.log( "Y : " + e.pageY );
	});
});

Disable right click in JQuery

$(document).ready(function(){
	$(document).on("contextmenu",function(e){
		return false;
	});
});

Difference between == and === in Javascript

The == (or !=) operator performs an automatic type conversion if needed.

In the otherhand, the === (or !==) operator will not perform any conversion. It compares both the value and type, which could be considered faster than ==.

Few Examples

Best Way to check Falsy values in Javascript

In Javascript world undefined, null, 0, false, NaN, '' (empty string) are all considered as false values.

So while coding if you want to check if a variable have a falsy value or not you need check the variable against all of these. Your code would look messed up if you keep comparing against all of these.

Luckly, there is an easy way. You can apply negation operation on the variable twice (eg. !!variable), which will convert the variable value to appropriate boolean equivalent.

function trueFalseCheck (variable) {
	if( !!variable ) {
	    console.log("True");
	} else {
	    console.log("False");
	}
}

How to turn off number input spinners in CSS3

Modern browsers add little up down arrows to number inputs called spinners.

You can turn them off visually like the below. This works in both Chrome and Firefox

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type=number] {
  -moz-appearance: textfield;
}

How to turn off Autocomplete for text input in HTML

The autocomplete attribute can be used to Enable/Disable the autocomplete feature of a HTML form element.

Note: The autocomplete attribute works with the following <input> types: text, search, url, tel, email, password, datepickers, range, and color.

This can be applied directly to the form to turn off the autocomplete features of all it child elements.

<form action="..." autocomplete="off" method="post" name="my-form">
	[...]
</form>

Also this attribute can be applied to individual elements.

<form action="..." method="post" name="my-form">
   <input autocomplete="off" name="text1" type="text" /> <!-- Off --> 
   <input autocomplete="on" name="text2" type="text" /> <!-- On -->
</form>

Cool horizontal devider in CSS

You can create a cool horizontal devider element (hr) using the below simple css code.

@media screen {
  hr.devider {
    border: 0;
    height: 1px;
    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
    background: linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
    margin: 35px 0 30px 0;
  }
}

Here is a live example.

How to change text selection styling in CSS3

The ::selection CSS pseudo-element applies rules to the portion of a document that has been highlighted (e.g., selected with the mouse or another pointing device) by the user.

Note that Only a small subset of CSS properties can be used in a rule using ::selection in its selector : color, background, background-color and text-shadow.

::-moz-selection {
	background: #24890d;
	color: #fff;
	text-shadow: none;
}
::selection {
	background: #24890d;
	color: #fff;
	text-shadow: none;
}