内容内容的媒体查询没有响应改变包含div的宽度

Question

我正在使用jquery $加载div #iframe 中的内容。获取 我想根据点击顶部按钮，移动设备，ipad，桌面的媒体查询来调整内容的大小 请访问以下链接 http://designgear.in/test/ js使用

    $(".mobile_scale").on("click", function(e) {
                e.preventDefault();
                $("#iframe").animate({
                    "width": "320px"
                }, 400);
                 setTimeout(function() {
                    adjustIframeheight();
                }, 500);
            });
            $(".tablet_scale").on("click", function(e) {
                e.preventDefault();
                $("#iframe").animate({
                    "width": "480px",
                    marginLeft: "auto",
                    marginLeft: "auto"
                }, 400);
                 setTimeout(function() {
                    adjustIframeheight();
                }, 500);
            });
            $(".desktop_scale").on("click", function(e) {
                e.preventDefault();
                $("#iframe").animate({
                    "width": "600px"
                }, 400);
                 setTimeout(function() {
                    adjustIframeheight();
                }, 500);
            });