Alex McLean
Alex McLean

Reputation: 2764

Set the height of a div to the same as a PHP value

I am attempting to make a small custom graph, and I would like to set the height of each part of the graph to a PHP variable.

I have a container with a fixed height:

.container {
   height: 200px;
}

I then have 3 additional divs within the container, lets say 'a', 'b' and 'c'. The values of a, b, and c are all taken from a database, so their height needs to be dynamic. In PHP, I get the weight of each div through simple math: $a_weight = $a / ($a + $b + $c) (for a). I would then like to set the height of div a to that weight. So, div a would be $a_height = $a_weight * 200. For example, if $a_weight = 30%, the resulting height of div a would be $a_height = 60px (.30*200).

Is this possible to do? Can I then do something like:

<div class="a" height=".$a_height."></div>

If not, what would be the best practice in order to get a value from a database (mysql), and set the height of an element proportionally based on that element.

Upvotes: 0

Views: 184

Answers (1)

David Calvin
David Calvin

Reputation: 194

You could use an AJAX request to fire off a PHP script that grabs data from your database, then returns that data back to the client. You could then use the returned data to style your HTML elements with JavaScript/jQuery.

Upvotes: 1

Related Questions