如何缩放整个div? [英] How to zoom an entire div?

问题描述

我现在正在此页面上使用一个函数..

I'm fooling around with a function right now on this page.

如果单击谁"部分，则div旋转.我希望它缩放并占用页面.

If you click the "who" section the div rotates. I'd like it to zoom and consume the page.

这可能吗?该怎么办?

推荐答案

旋转后，将其宽度和高度设置为页面的宽度和高度.

After it rotates, set its width and height to be the width and height of the page.

$('#who').rotate({
    angle:-90,
    bind: [{
        click: function(){
            $(this).rotateAnimation(0);
        }
    }], // remove the trailing comma here
    callback: function (){
        var $window = $(window);
        $(this).height($window.height()).width($window.width());
    }
});

---

编辑关于:OP的评论

$('#who').rotate({
    angle: -90,
    bind: [{
        click: function(){
            $(this).rotateAnimation(0);
        }
    }],
    callback: function (){
        $(this).width(800).height(600);
    }
});

请参见 .height() 和 .width() .

使用当前的CSS，您需要缩放img.

With your current CSS, you need to scale the img.

$('#who').rotate({
    angle: -90,
    bind: [{
        click: function(){
            $(this).rotateAnimation(0);
        }
    }],
    callback: function (){
        $('#who > img').animate({height: 600, width: 800});
    }
});

例如，如果将图像的height和width更改为100%，则只需更改div的大小，图像就可以随之缩放.

If you change, say, the image's height and width to be 100% then you only need to change the size of the div and the image should scale with it.

$('#who').animate({height: 600, width: 800});

这篇关于如何缩放整个div?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！