Passing jquery function as variable parameter to the custom function -


i writing function calculates biggest height / width , makes elements of same height / width. want pass 2 parameters function:

1. selector, can be(element, class ) 2. jquery `width()` / `height()` function 

and desired result should function looks like..

eg 1. equaldimensions('.class', width() ); or eg 2. equaldimensions( div, height() ); 

and based on passed function width() / height() calculate biggest height / width , make selectors passed first parameter equal width / height.

being new jquery, struggling putting code.

this have tried far...

var equaldimension = function(  selector,  fn ){     var dimension = fn();     var biggestdimemsion = 0;     $(selector).each(function(){         if($(this).dimension > biggestdimemsion){             biggestdimemsion = $(this).dimension;         }     });     $(selector).each(function(){         $(this).dimension(biggestdimemsion);     }); }; 

i wrote quick example of how approach problem:

http://jsfiddle.net/3nrah/

var equaldimension = function (selector, fn) {     var $elements = $(selector),         dimensions = $elements.map(function (i) {             return $elements.eq(i)[fn]();         }),         maxdimension = math.max.apply(math, dimensions);     $elements[fn](maxdimension); };  equaldimension('div', 'height'); 

this assumes passing name of jquery function, rather function itself. if want pass actual function, this:

http://jsfiddle.net/3nrah/1/

var equaldimension = function (selector, fn) {     var $elements = $(selector),         dimensions = $elements.map(function (i) {             return fn.call($elements.eq(i));         }),         maxdimension = math.max.apply(math, dimensions);     fn.call($elements, maxdimension); };  equaldimension('div', $.fn.height); 

edit: in terms of creating clean ui this, most-likely add in following jsbin.

http://jsbin.com/pogujozane/edit?js,output

$.fn.equaldimension = function (fn) {     var $elements = $(this),         dimensions = $elements.map(function (i) {             return $elements.eq(i)[fn]();         }),         maxdimension = math.max.apply(math, dimensions);     $elements[fn](maxdimension); }; $.fn.equalheight = function () {   return $(this).equaldimension('height'); }; $.fn.equalwidth = function () {   return $(this).equaldimension('width'); }  

so called like:

$('div').equalheight(); 

Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -