icons in pseudo-element ::before ::after content

With CSS3 you can use content property of any pseudo-element, like ::before or ::after. By utilizing this property you can easily implement basic icons for you HTML-markup.
There are in total 18+ icons and symbols available out of the box!

Using this in DOM elements selectors

The word this in JavaScript has a several meaning depending on a contest of a function call. But also in DOM-manipulations this can invoke useful properties of element if used properly. Below is the list of 15 cases how this can be used for DOM manipulations with all tags, inputs/selects and specifically interesting with parts of HREF attribute of <a> tag.

choosing native javascript vs jquery - links

At some point every front end developer comes to thought that in some cases using native JS can be preferential to jQuery due to performance overhead. Below is the list of articles I've recently came across that cover this topic.

How to retrieve position X,Y of html element

How to define in what exactly position (X,Y) is the DOM element on page?
For example you have svg-area on your page and you need to adjust events on it, or 

1) For mouse events you can use event.clientX and event.clientY properties

2) When you use jQuery you can call position() method which will return object with 2 properties:

var position  = $(elem).position();

//position.left, position.top

3)  But if you have to make it in pure javascript you should use getBoundingClientRect() method on your DOM-element. It works like this:

var rect = document.getElementsById('svg').getBoundingClientRect();
//rect.top, rect.right, rect.bottom, rect.left

details about the method on developer.mozilla.org

3 interesting details of jQuery functionality

1) $.makeArray - for handling Array-like objects in JS like nodeList and arguments
usually is't workaround by this

[].forEach.call(list, function() {...});

but one can also use:

$.makeArray(list).forEach(function() {...});
2) function attr can do more - removing attribute as well
it meas that
attr('xxx') -> removeAttr('xxx')

or you can have such a nice construction
$(selector).attr(anAttr, condition ? value : null);

3) jQuery.type() instead of typeof

Full article link: http://www.sitepoint.com/5-little-known-details-jquery-methods/