Take measurements of an element and play on variables? How to make?

5

Is there a way (using Sass maybe) to take the measures ( width and / or height ) of already defined elements and store them in variables to use them in calculations of other elements?

    
asked by anonymous 12.02.2014 / 00:43

2 answers

3

Have by javascript. Using jQuery you can get the size of a div , for example, like this:

var largura = $('div#id').width();

The height:

var altura = $('div#id').height();
    
12.02.2014 / 01:07
0

Using the YUI 3 framework the solution is this:

var largura, altura;

YUI().use('node', function (Y) {
    largura = Y.one('div#meu-id').getComputedStyle('width');
    altura = Y.one('div#meu-id').getComputedStyle('height');
});

Using JavaScript only (Chrome, Firefox, Opera, and Safari)

<style>
  div#meu-id  {
    height: 300px;
  }
</style>

<div id="meu-id">Meu conteúdo</div>

var RefDiv = document.getElementById("meu-id");
var largura = document.defaultView.getComputedStyle(RefDiv, null).getPropertyValue("width");
var altura = document.defaultView.getComputedStyle(RefDiv, null).getPropertyValue("height");
setTimeout( function() { alert('largura = ' + largura + ', altura = ' + altura); }, 5000);

I used setTimeout in case there is code that changes the content of the element and so we give some time for rendering.

    
18.02.2014 / 14:10