javascript - understanding the code from transit.js -
i going through source of transit.js , came across following fucntion ::
$.csshooks['transit:transform'] = { // getter returns `transform` object. get: function(elem) { return $(elem).data('transform') || new transform(); }, // setter accepts `transform` object or string. set: function(elem, v) { var value = v; if (!(value instanceof transform)) { value = new transform(value); } // we've seen 3d version of scale() not work in chrome when // element being scaled extends outside of viewport. thus, we're // forcing chrome not use 3d transforms well. not sure if // translate affectede, not risking it. detection code // http://davidwalsh.name/detecting-google-chrome-javascript if (support.transform === 'webkittransform' && !ischrome) { elem.style[support.transform] = value.tostring(true); } else { elem.style[support.transform] = value.tostring(); } $(elem).data('transform', value); } };
i understand latter part of function, hard understand initial part of function, function can found on git , here .
initially see this, $.csshooks['transit:transform']
line saying?
after have below line of code i.e. getter , setter method,
set: function(elem, v) {
but passing elem , v inside function, don't see being passed?
read csshooks @ jquery csshooks
look @ source code (search hooks.get
, hooks.set
)
.csshooks
array
of objects
contains getter , setters tha executed .css()
. thats all.
$.csshooks['transit:transform'] = {set: function(elem,value){}, get: function(elem){}} equal: $.csshooks['transit:transform'] = {}; $.csshooks['transit:transform'].set = function(elem, value){}; $.csshooks['transit:transform'].get = function(elem){}; $(element).css('transit:transform',value) comes to: $.csshooks['transit:transform'].set(element,value) $(element).css('transit:transform') comes to: $.csshooks['transit:transform'].get(element)
$.csshooks['transit:transform'] = {set:function(){}, get: function(){} }
{...}
object creation.get
, set
not executed @ moment.
created {set:function(){}, get: function(){} }
so. simply: .css()
execute set
, get
functions hooked property.
if want know how real getters , setters works: object.defineproperty()
Comments
Post a Comment