Question

我有一个在加载和窗口调整大小时运行的函数。我想在将其调整为另一个变量之后使用新值。我没有得到值的大小部分。

$(window).load(function(){
           var a=imageSize();
           getResizeImageWidthHeight(a);
            otherFunction();    
        });
        $(window).resize(function(){
            imageSize();

        });

图片调整大小

var imageSize =function() {
            var status='0';
            if( $(window).width()-300 > $(window).height() ) {
                $('#images').css({
                    'width': 'auto',
                    'height': ( $(window).height() )+'px'
                });
                status='1';
            }
            else {
                $('#images').css({
                    'width': ( $(window).width() )+'px',
                    'height': 'auto'
                });
                status='2';
            }
            return status;

        }

调整图像宽度和高度

function getResizeImageWidthHeight(a) {
           x=a;
           if(x=='1') {
                    $("#images").load(function() {
                        imgWidth = this.width;
                        alert( "imgWidth: " + imgWidth );
                    });
                var imgHeight = $("#images").height();

            } else if(x=='2') {
                    $("#images").load(function() {
                        var imgHeight = this.height;
                    });
                var imgWidth = $("#images").width();
                alert( " imgHeight: " + imgHeight);
            } 
        }

并使用功能

function otherFunction() {
            var xWidth=imgWidth*2;
            var xHeight=imgHeight*3;
            .
            .
            etc. 
        }

Answer 1

如果您尝试使用容器缩放图像，则在窗口调整大小时，重新计算宽度/高度的方法比fluid layout想法更为简单。

基本上，您将图像设置为max-width: 100%;，它们将根据容器的大小进行缩放。

不确定这是否是你的意图，但它不是js。查看链接以获取更多详细信息。

要调整图片大小后的大小：

您可以将尺寸保存在全局变量中，只需删除var :(不推荐）

imgHeight = $("#images").height();
imgWidth = $("#images").width();

或者您可以使用jquery：

再次查询元素的高度

var xWidth = $("#images").width() * 2;
var xHeight = $("#images").height() * 3;

使用jquery获取可变大小的图像宽度和高度

1 个答案: