0

我正在为我的应用程序创建一个任务管理器,并且我正在尝试计算小部件的高度,然后在满足要求时执行某些操作。基本上我想得到窗口的高度减去另一个数字来获得任务小部件的最大高度(已经设置了最小高度)。然后我想动态获取 div 的实际高度,如果它等于最大高度,我想更改一些 css 属性。我正在使用 jquery 1.5.2 来执行此操作。这是我所拥有的...

$(document).ready(function() {
//Get the height for #tasks
var tH = Math.round($(window).height() - 463);
$('#tasks').css('height', tH); //Make it the max height
var ti = Math.round($("#tasks").height()); //Get actual height of #tasks

if(tH==ti){ // If #tasks actual height is equal to the max-height than do...
    //alert('true');
    $('.taskItems').css('width', '172px');
    $('.tT, .tD').css('width', '135px');
    console.debug(ti + ' ' + tH);
}else{
    alert(tH + ' ' + ti); 
    console.debug(ti + ' ' + tH);
}
});

只要"alert('true')"首先触发并且"max-height"更改为"height" ,这效果很好。

当警报被注释掉时,if 语句停止工作。

当。。。的时候

$("#tasks").css('height', tH) 改为 $("#tasks").css('max-height', tH)

价值观非常糟糕。示例:78/130。CSS如下...

#tasks {
    border:1px solid #D1D1D1;
    border-top:none;
    color:rgb(82,124,149);
    display:inline-block;
    font-size:12px;
    margin:0px 0px 0px 1px;
    overflow:auto;
    width:194px;
}

任何帮助,将不胜感激。提前致谢。

4

2 回答 2

1

每次调整窗口大小时,我都会使用以下内容:

jQuery(document).ready(function () {

    jQuery(window).resize(function () {
        //alert("window changed");
        resizeDivs();
    });
});

function resizeDivs() {
    var clientWidth = jQuery(window).width();
    var clientHeight = jQuery(window).height();
    var newHeight = 100;
    var newWidth = 100;

    var firstDatasegment = jQuery(".datasegment")[0];

    if (!jQuery(firstDatasegment).width()) {
        currentWidth = jQuery(firstDatasegment).clientWidth;
        newHeight = currentWidth - (currentWidth / 7);
        newWidth = currentWidth;
    }
    else {
        //currentWidth = jQuery(".datasegment")[0].css("width");
        currentWidth = jQuery(firstDatasegment).width();
        newHeight = currentWidth - (currentWidth / 7);
        newWidth = currentWidth;
    }

    jQuery(".datasegment").height(newHeight);
    jQuery(".sidemenu").height(clientHeight);
    jQuery(".maindatacontent").height(clientHeight);
    jQuery(".text-glow").css("font-size", (clientWidth / 50) + "px");
    jQuery(".hovermenuicon .menudesc").not('.bucketText').css("font-size", (clientWidth / 50) + "px");
    jQuery("td.menudesc span:first-child").not('.bucketText').css("font-size", (clientWidth / 50) + "px");
    jQuery(".sidemenudesc").css("font-size", (clientWidth / 80) + "px");
    jQuery(".datavalue").css("font-size", (clientWidth / 80) + "px");
    jQuery(".mainmenuitem").css("font-size", (clientWidth / 50) + "px");
    jQuery(".qireportgridview table").css("font-size", (clientWidth / 80) + "px");
    jQuery(".scrolldivbig").height(clientHeight);
}

为了让我为您提供更多帮助,我需要查看您最基本的 html 以使其正常工作,然后我将使用工作示例相应地更改代码。

hth

于 2012-08-28T00:08:31.223 回答
1
  1. 你也可以$('').height()用作二传手!-->$('#tasks').height(th);

  2. 使用 $('').css('height': myVal) 时请记住,您需要指定一个单位(例如 px)。你现在不这样做。

  3. 你是什​​么意思

当警报被注释掉时,if 语句停止工作。

当您删除警报时,您的 else-branch 没有做任何事情。

于 2012-08-28T00:12:17.673 回答