How do I call a JavaScript function that uses jQuery? -

How do I call a JavaScript function that uses jQuery? -

this question has reply here:

how execute jquery code [closed] 2 answers

i found function:

function squarifyme(element) { squareitup() window.onresize = function(element) { squareitup(); } function squareitup() { $(element).height($(element).width()); } }

with call:

$(document).ready(function() { squarifyme('.myelement'); });

but don't know how add together webpage... i've done bunch of times can't work.

the function named squarifyme() uses jquery.

this means first thing have import jquery.

the easiest way utilize hosted library.

to utilize google's hosted version of jquery, add together html page:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

alternatively, download jquery , include yourself.

. . .

now explain sec piece of code:

$(document).ready(function() { squarifyme('.myelement'); });

the first line says "execute next code when page ready."

you can learn more reading documentation $(document).ready().

. . .

now explain next piece of code:

squarifyme('.myelement'); function squareitup() { $(element).height($(element).width()); }

the first line above invokes function squarifyme() string parameter when document ready.

inside squarifyme() function squareitup() invoked.

it next (piece piece):

$('.myelement')

this code selects elements in document have css class myelement.

all such elements returned set, manipulated chained jquery code follows.

you can learn more selecting dom elements class here.

let's rewrite line of code clarity:

$(element).height($(element).width());

we'll rewrite this:

var $s = $(element); $s.height($s.width());

now $s equals set of dom elements have css class myelement.

in sec half of line, get width of each element in $s this:

$s.width()

you can learn more reading documentatino jquery.width().

we set height of element equal width this:

$s.height($s.width());

this create every element class myelement square.

. . .

now explain lastly piece of code:

window.onresize = function(element) { squareitup(); }

this code registers event handler window.onresize.

in other words, causes squareitup() invoked whenever user resizes browser window.

so... every time resize browser, every dom element class myelement become square.

you can learn more reading documentation window.onresize.

javascript jquery