Div有一个简单的可变高度

时间:2015-06-16 22:02:35

标签: javascript html css variables height

所以,我想创建一个div,它具有我将从数据库中获取的值的高度。为了更好地理解,该值是客户在网站上购买的次数。我正在考虑一种方法,让我的div随着价值上涨而上涨。<​​/ p>

这样的事情:

var divHeight = numberOfValues;
numberOfValues = heightOfDiv; (div's height property)

if (numberOfValues == 0) {
   divHeight = 0;
} else {
    divHeight = numberOfValues + 10;
}

逻辑是让每个值都增加10px的div。因此,如果值为10,则高度应为100px。

实现此解决方案的最佳方式是什么?这跟我想的一样简单吗? (简单!=简单)。

2 个答案:

答案 0 :(得分:0)

<?php
$numberOfPurchases = getNumberOfPurchases(); // call the function that queries the database
?>
<script>
var defaultDivHeight = 10;
var purchaseDiv = document.getElementById('purchaseDiv');
if (<?= numberOfPurchases; ?> > 0)
{
    purchaseDiv.style.height = <?= numberOfPurchases; ?> * defaultDivHeight + 'px';
}
else
{
    purchaseDiv.style.height = defaultDivHeight + 'px';
}
</script>

我建议在PHP中使用PDO来查询数据库。

答案 1 :(得分:-1)

    <script>
       var divHeight = numOfVisits * 10;
       var divDisplay = document.getElementById("display");

       if(divHeight>0)
              divDisplay.style.height = divHeight + "px";
       else
              divDisplay.style.height = "1px";
    </script>