iframe可调整大小

时间:2016-11-03 01:17:01

标签: javascript iframe

我有这个脚本,但我想简化它来调整iframe的大小。

.....................................................................
/*! Viewport Resizer */
(function(o, y, O) {
    var ca = "https:" === location.protocol ? "https://" : "http://",
        da = y.createElement("script"),
        ea = y.getElementsByTagName("script")[0];
    da.src = ca + "ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js";
    ea.parentNode.insertBefore(da, ea);
    y.close();
    var fa = function(a) {
        if (o.jQuery && jQuery.fn.jquery === "2.0.1") a(jQuery);
        else {
            o.jQuery && jQuery.noConflict();
            o.setTimeout(function() {
                fa(a)
            }, 100)
        }
    };
    fa(function(a) {
        function z(b) {
            b = typeof b === "undefined" ? a("a.active", n) : a(b);
            var e = b.attr("data-viewport").toDimension();
            a("a.active", n).add(a("a.active", H)).removeClass("active").end(b.addClass("active"));
            ga(e)
        }

        function A(b, e) {
            var d = b ? b : a("a.active", n).add(a("a.active", H)),
                h = b ? d.attr("data-viewport").toDimension() : {
                    width: B,
                    height: I
                },
                i = e == "swap" ? {
                    width: h.height,
                    height: h.width
                } : {
                    width: h.width,
                    height: h.height
                },
                g = i.width + "x" + i.height,
                f = RegExp(e == "swap" ? h.width + "x" + h.height : h.height + "x" + h.width, "g");
            h = e != null ? ha(e == "swap" && d.is(".portrait, .landscape") ? d.hasClass("landscape") ? 0 : -90 : e) : ha(h);
            var l = d.text();
            if (d.hasClass("custom") ||
                !d.attr("data-icon")) {
                d.text(l.replace(f, g));
                l = d.text() === g ? "Custom" : d.text()
            }
            ia.html("").append(a("<b>").text(l)).append(a("<span>").text("Size: " + g + " (" + h + "), Ratio: " + function(k, j) {
                function q(s, P) {
                    if (P === 0) return s;
                    return q(P, s % P)
                }
                c = q(k, j);
                return k / c + ":" + j / c
            }(i.width, i.height)));
            d.attr("title", l);
            ja.attr("class", d.is('[data-viewport="auto"]') ? "auto" : "").css({
                width: i.width,
                height: i.height,
                "margin-left": -i.width / 2
            });
            if (!b) {
                r.val(g).triggerHandler("edit");
                ka = r.val()
            }
        }

        function Da() {
            var b = "";
            a('a:not([data-viewport="auto"])',
                "#devices").clone().removeAttr("class").each(function() {
                b += a(this).prop("outerHTML")
            });
            a("#bookmarklet", C).attr({
                href: "javascript:void((function(d){if(self!=top||d.getElementById('toolbar')&&d.getElementById('toolbar').getAttribute('data-resizer'))return false;d.write('<!DOCTYPE HTML><html style=\"opacity:0;\"><head><meta charset=\"utf-8\"></head><body>" + b + '<script src="' + Ea + "\"><\/script></body></html>')})(document));"
            })
        }

        function Fa() {
            function b(k) {
                var j = g && typeof g === "number" ? g : Math.min(100 / u * B /
                    100, 1);
                j = Math.min(j, 10);
                j = Math.max(j, 0.25);
                j = k ? "" : "scale(" + j + ")";
                k = k ? "" : "0 0";
                v.css({
                    zoom: j,
                    "-webkit-transform": j,
                    "-webkit-transform-origin": k,
                    "-moz-transform": j,
                    "-moz-transform-origin": k,
                    "-ms-transform": j,
                    "-ms-transform-origin": k,
                    "-o-transform": j,
                    "-o-transform-origin": k,
                    transform: j,
                    "transform-origin": k
                })
            }

            function e(k) {
                v.css({
                    "min-width": k ? "" : u + "px",
                    "min-height": k || !l ? "" : l + "px"
                })
            }
            if (!m) return false;
            var d = function() {
                    var k = {};
                    if (m.find("meta[name=viewport]", "head").length) {
                        var j = m.find("meta[name=viewport]:first",
                            "head");
                        typeof j.attr("content") !== "undefined" && j.attr("content").replace(/(\s)\s*/gm, "").split(/[,;.]+/).map(function(q) {
                            q = q.split("=");
                            k[q[0]] = q[1]
                        })
                    }
                    return k
                }(),
                h = d.width || false,
                i = d.height || false;
            d = d["initial-scale"] || false;
            var g = true,
                f = true,
                l = false;
            if (Q) {
                b("clear");
                e("clear");
                return false
            }
            if (h)
                if (h !== "device-width") u = Number(h);
                else f = g = false;
            else u = 980;
            if (i && i !== "device-height") l = Number(i);
            if (d) {
                f = g = false;
                if (d === "minimum-scale") d = 0.25;
                if (d === "maximum-scale") d = 10;
                d = Number(d);
                if (d < 1) {
                    u = 980 + 1 * d;
                    f = g = true
                } else if (d > 1) g = d
            }
            g && b();
            f && e()
        }

        function la() {
            m = p.contents();
            u = m.width() || 0;
            v = a("html", m);
            R = a("body", m);
            S = v.add(R);
            if (!ma) {
                var b = ["DOMMouseScroll", "mousewheel"];
                if (a.event.fixHooks)
                    for (var e = b.length; e;) a.event.fixHooks[b[--e]] = a.event.mouseHooks;
                a.event.special.mousewheel = {
                    setup: function() {
                        if (this.addEventListener)
                            for (var f = b.length; f;) this.addEventListener(b[--f], d, false);
                        else this.onmousewheel = d
                    },
                    teardown: function() {
                        if (this.removeEventListener)
                            for (var f = b.length; f;) this.removeEventListener(b[--f],
                                d, false);
                        else this.onmousewheel = null
                    }
                };
                a.fn.extend({
                    mousewheel: function(f) {
                        return f ? this.bind("mousewheel", f) : this.trigger("mousewheel")
                    },
                    unmousewheel: function(f) {
                        return this.unbind("mousewheel", f)
                    }
                });
                var d = function(f) {
                        var l = f || o.event,
                            k = [].slice.call(arguments, 1),
                            j = 0,
                            q = 0,
                            s = 0;
                        f = a.event.fix(l);
                        f.type = "mousewheel";
                        if (l.wheelDelta) j = l.wheelDelta / 120;
                        if (l.detail) j = -l.detail / 3;
                        s = j;
                        if (l.axis !== O && l.axis === l.HORIZONTAL_AXIS) {
                            s = 0;
                            q = -1 * j
                        }
                        if (l.wheelDeltaY !== O) s = l.wheelDeltaY / 120;
                        if (l.wheelDeltaX !== O) q = -1 * l.wheelDeltaX /
                            120;
                        k.unshift(f, j, q, s);
                        return (a.event.dispatch || a.event.handle).apply(this, k)
                    },
                    h = p.height(),
                    i = 0;
                v.css("overflow-y", "hidden");
                S.on("mousewheel", function(f, l, k, j) {
                    f.preventDefault();
                    f = 0.05;
                    if (l > 0.1) f *= 5;
                    j = j > -f && j < f;
                    if (!(k < -f && j || k > f && j)) {
                        k = m.height() - h;
                        i -= l * Ga;
                        if (i < 0) i = 0;
                        if (i > k) i = k;
                        m.scrollTop(i)
                    }
                })
            }
            T && S.css({
                overflow: "scroll",
                "-webkit-overflow-scrolling": "touch",
                width: "100%",
                height: "100%"
            });
            e = v.css("background-color");
            var g = R.css("background-color");
            p.css("background-color", e === "transparent" || e ===
                "rgba(0, 0, 0, 0)" ? g === "transparent" || g === "rgba(0, 0, 0, 0)" ? "#fff" : g : e);
            m.find("title", "head").length && !U.find("title").length && U.prepend(m.find("title").prepend("↔ "));
            Ha()
        }

        function Ia(b) {
            function e(h) {
                a("[data-viewport].active", "#devices").attr({
                    "data-viewport": h.height + "x" + h.width
                }).orientationClassName();
                return {
                    width: h.height,
                    height: h.width
                }
            }
            var d = a("a.active", n).attr("data-viewport").toDimension();
            if (b === 0 || b === 180) {
                if (d.width > d.height) d = e(d)
            } else if (b === 90 || b === -90)
                if (d.height > d.width) d =
                    e(d);
            ga(d)
        }

        function ga(b) {
            B = b.width;
            I = b.height;
            b = (Q = b.auto) ? "auto" : "";
            var e = T && Q || J.hasClass("active") ? "" : " transition";
            D.attr("class", a.trim(b.concat(e)));
            w.css({
                width: B,
                height: I
            });
            var d = setTimeout(function() {
                Fa();
                clearTimeout(d)
            }, 200);
            A()
        }

        function ha(b) {
            if (typeof b === "object") b = b.width === b.height ? false : b.width > b.height ? -90 : 0;
            return b === 0 || b === 180 ? "Portrait" : b === 90 || b === -90 ? "Landscape" : V
        }

        function na(b) {
            b = b.filter(function() {
                return a(this).attr("data-viewport").length > 0
            });
            var e = a('<a data-viewport="auto" data-icon="auto">Auto Size</a>').add(b.clone());
            b.remove();
            n.html("");
            a.each(e, function() {
                n.append(a("<li>").append(a(this).setProperties().orientationClassName()))
            })
        }

        function oa() {
            E.add(C).addClass("updated");
            pa.removeClass("invisible")
        }

        function qa() {
            a("a.active", n).length ? z(a("a.active", n).removeClass("active").get(0)) : z(a('[data-viewport="auto"]', W))
        }

        function Ha() {
            var b = {
                Version: "Viewport Resizer (" + Ja + ")",
                "User agent": K,
                "Meta viewport": m.find("meta[name=viewport]:first", "head").attr("content")
            };
            X.html("");
            a.each(b, function(e, d) {
                X.append(a("<dt>").text(e)).append(a("<dd>").html(d ?
                    d : V))
            })
        }

        function ra() {
            var b = F.css("background-color");
            D.css("color", function(e) {
                e = e.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
                var d = parseInt(e[1]),
                    h = parseInt(e[2]);
                e = parseInt(e[3]);
                return Math.sqrt(d * d * 0.241 + h * h * 0.691 + e * e * 0.068)
            }(b) < 130 ? "#fff" : "#000")
        }
        if (a("#toolbar[data-resizer]").length) return false;
        var Ja = "1.1.4",
            L = ca + "lab.maltewassermann.com/viewport-resizer/",
            Y = L + "resizer.min.css",
            Ea = L + "resizer.min.js",
            t = a(o),
            sa = a("html"),
            U = a("head"),
            F = a("body"),
            G = a(location).attr("href"),
            V = "n/a",
            K = typeof navigator.userAgent ===
            "undefined" ? V : navigator.userAgent,
            ma = /webkit/i.test(K),
            T = /mobile.*safari/i.test(K);
        L = /opera/i.test(K);
        var Ka = a('<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">');
        Y = a('<link rel="stylesheet" href="' + Y + '">');
        var ta = a('<style type="text/css" media="print">'),
            C = a('<div id="expand">').hide(),
            X = a("<dl>"),
            La = a('<a id="bookmarklet">').attr("data-text", "Your bookmarklet").append(a("<span>").html("↔ Resizer")),
            pa = a('<span class="invisible">').text(" has been changed. Please save or update your bookmarklet."),
            W = a('<div id="toolbar">').attr("data-resizer", "basic"),
            n = a('<ul id="devices">'),
            H = a('<ul id="tools">'),
            r = a('<input id="edit" type="text" value="">'),
            ua = a('<a id="add" data-viewport="" data-icon="add" title="Add size to toolbar">'),
            ia = a('<li class="info">'),
            Ma = a('<ul id="extras">'),
            Z = a('<a title="Animate Viewport">').text("Animate"),
            $ = a('<a data-icon="reload" title="Reload current page">'),
            va = a('<a data-icon="print" title="Print Viewport">'),
            M = a('<a data-icon="close" title="Close toolbar">'),
            E = a('<a data-icon="hint" title="Information">'),
            D = a('<div id="container">'),
            w = a('<div id="wrapper">'),
            p = a('<iframe id="content" name="content" frameborder="0">').attr("src", G),
            wa = a('<b id="handle-e">'),
            xa = a('<b id="handle-s">'),
            aa = a('<b id="handle-w">');
        G = a('<b id="handle-se">');
        var ya = a('<b id="handle-sw">'),
            J = wa.add(xa).add(aa).add(G).add(ya),
            ja = a('<div id="phantom">');
        G = new Date;
        var ba = t.innerWidth() || o.innerWidth || 400,
            za = t.innerHeight() || o.innerHeight || 400,
            N = 10,
            Ga = L ? 2 : 30,
            x = 50,
            m = false,
            B, I, Q, Aa, v, R, S, u, ka;
        String.prototype.toDimension = function() {
            if (this ==
                "auto") return {
                width: ba,
                height: za - 42,
                auto: true
            };
            else {
                var b = this.match(/\d{1,}\d/g);
                if (b) {
                    b = b.slice(0, 2);
                    return {
                        width: parseInt(typeof b[0] === "undefined" ? 400 : b[0]),
                        height: parseInt(typeof b[1] === "undefined" ? 600 : b[1]),
                        auto: false
                    }
                } else return null
            }
        };
        a.fn.setProperties = function() {
            var b = a(this);
            if (b.is(":empty")) {
                var e = b.attr("data-viewport").toDimension();
                b.addClass("custom").text(e.width + "x" + e.height)
            }
            return b.attr("title", b.text())
        };
        a.fn.orientationClassName = function() {
            var b = a(this).attr("data-viewport").toDimension();
            b = b.width > b.height && !b.auto ? "landscape" : b.height > b.width && !b.auto ? "portrait" : "";
            return a(this).removeClass("portrait landscape").addClass(b)
        };
        (function() {
            function b(g) {
                g.preventDefault();
                p.css("pointer-events", "none");
                var f = i.is(aa) || i.is(ya) ? h.x - g.pageX : g.pageX - h.x;
                f = i.is(xa) ? h.w : Math.max(f + (h.w / 2 + d().w / 2), 0);
                g = i.is(wa) || i.is(aa) ? h.h : Math.max(g.pageY - h.y + h.h, 0);
                f = f > N ? f : N;
                g = g > N ? g : N;
                r.val(f + "x" + g).triggerHandler("change");
                i.addClass("active")
            }

            function e() {
                t.off({
                    mousemove: b,
                    mouseup: e
                });
                p.css("pointer-events",
                    "");
                i.removeClass("active");
                D.addClass("transition")
            }

            function d() {
                return {
                    w: parseInt(w.css("width")) || w.width() || 0,
                    h: parseInt(w.css("height")) || w.height() || 0
                }
            }
            var h = {},
                i;
            J.on({
                mouseenter: function() {
                    J.hasClass("active") || a(this).addClass("hover")
                },
                mouseleave: function() {
                    a(this).removeClass("hover")
                },
                mousedown: function(g) {
                    g.preventDefault();
                    i = a(this);
                    h = {
                        w: d().w,
                        h: d().h,
                        x: g.pageX,
                        y: g.pageY
                    };
                    t.on({
                        mousemove: b,
                        mouseup: e
                    });
                    Z.triggerHandler("stop")
                }
            })
        })();
        U.prepend(Ka).prepend('<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9, chrome=1">').prepend(Y.on("load",
            function() {
                ra()
            })).append(ta);
        C.append(a('<div class="inner">').append(a('<p class="well">').append(La).append(pa)).append(X).append(a('<p class="muted">').html('About: <a href="http://lab.maltewassermann.com/viewport-resizer/" target="_blank">Viewport Resizer</a> is designed by Malte Wassermann (c) ' + G.getFullYear()))).appendTo(F);
        W.append(n).append(H.append(a("<li>").append(a('<label for="edit" data-icon="edit" title="Customize current size"><span>Customize:</span></label>')).append(r).append(ua)).append(ia)).append(Ma.append(a("<li>").append(Z)).append(a("<li>").append($)).append(ma ?
            a("<li>").append(va) : null).append(a("<li>").append(E)).append(a("<li>").append(M))).appendTo(F);
        D.append(ja).append(w.append(p).append(J)).appendTo(F);
        na(a("[data-viewport]", F));
        r.on("edit", function() {
            a(this).css("width", Math.round((a(this).val().length + 1) * 7))
        }).on("mouseover focus", function() {
            a(this).parent().addClass("hover")
        }).on("mouseout blur", function(b) {
            if (b.type == "blur" || !a(this).is(":focus")) a(this).parent().removeClass("hover")
        }).on("keyup", function() {
            a(this).triggerHandler("edit")
        }).on("change",
            function() {
                var b = a(this).val().toDimension();
                if (b) {
                    a(this).parent().addClass("activeAdd");
                    b = a("#add").text("").attr({
                        "data-viewport": b.width + "x" + b.height
                    }).setProperties();
                    z(b);
                    a(this).trigger("blur")
                } else a(this).val(ka).triggerHandler("edit")
            });
        ua.on("click touchend", function(b) {
            b.preventDefault();
            b = a(this);
            var e = b.clone();
            b.removeClass("active").fadeOut("slow", function() {
                a("li.activeAdd", H).removeClass("activeAdd");
                a("<li>").append(e.removeAttr("id").removeAttr("data-icon").removeAttr("title").removeClass("custom").orientationClassName().fadeIn("slow")).appendTo(n);
                oa()
            })
        });
        E.on("click touchend", function(b) {
            b.preventDefault();
            Da();
            a(this).toggleClass("active");
            E.hasClass("updated") || C.removeClass("updated");
            C.slideToggle(150, function() {
                E.removeClass("updated")
            })
        });
        (function() {
            function b() {
                var f = Math.max(ba - x, e);
                g = Math.max(g, e);
                r.val(g + "x" + I).triggerHandler("change");
                if (g > f - x) d = false;
                else if (g === e) d = true;
                if (d) g += x % f;
                else g -= x % f
            }
            var e = 320,
                d = false,
                h = false,
                i, g;
            Z.on("start", function() {
                i = true;
                g = Math.round(B / x) * x;
                b();
                h = setInterval(b, 750);
                a(this).addClass("active")
            }).on("stop",
                function() {
                    i = false;
                    clearInterval(h);
                    h = false;
                    a(this).removeClass("active")
                }).on("click touchend", function(f) {
                f.preventDefault();
                i ? a(this).triggerHandler("stop") : a(this).triggerHandler("start")
            })
        })();
        $.on("click touchend", function(b) {
            b.preventDefault();
            p.get(0).contentWindow.location.reload(true);
            p.on("load", function() {
                la()
            })
        });
        va.on("click touchend", function(b) {
            b.preventDefault();
            ta.html("body,#content{height:" + m.height() + "px !important;}");
            o.focus();
            o.print()
        });
        M.on("click touchend", function(b) {
            b.preventDefault();
            o.location.href = m.get(0).location.href
        });
        n.on("click touchend", '[data-viewport]:not(".active")', function(b) {
            b.preventDefault();
            z(a(this))
        }).on("mouseenter", '[data-viewport]:not(".active")', function() {
            A(a(this))
        }).on("mouseleave", '[data-viewport]:not(".active")', function() {
            A()
        }).on("click touchend", '[data-viewport]:not([data-viewport="auto"]).active', function(b) {
            b.preventDefault();
            a(this).removeClass("hover");
            Ia(a(this).hasClass("landscape") ? 0 : -90)
        }).on("mouseenter", '[data-viewport]:not([data-viewport="auto"]).active',
            function() {
                a(this).addClass("hover");
                A(a(this), "swap")
            }).on("mouseleave", '[data-viewport]:not([data-viewport="auto"]).active', function() {
            a(this).removeClass("hover");
            A()
        });
        p.on("load", function() {
            try {
                Aa = p.contents().get(0).location.href
            } catch (b) {
                alert("Access denied: Cross-domain security error");
                p.attr({
                    src: Aa
                });
                return false
            }
            la();
            if (T) {
                W.add(D).not(n).on("click touchend", function(d) {
                    !a(d.target).is(r) && r.is(":focus") && r.trigger("blur")
                });
                p.attr({
                    scrolling: "no"
                })
            }
            qa();
            sa.css("opacity", 1);
            var e = setTimeout(function() {
                sa.addClass("complete");
                clearTimeout(e)
            }, 10)
        });
        var Ba = false,
            Ca = false,
            Na = [17, 224, 91, 93];
        t.on("keydown", function(b) {
            if (b.keyCode == 116 || Ca && b.keyCode == 82) Ba = true;
            if (Na.indexOf(b.keyCode) >= 0) Ca = true;
            if (Ba) {
                b.preventDefault();
                $.click()
            }
            if (b.keyCode === 27) {
                b.preventDefault();
                M.click()
            }
        }).on("resize", function() {
            ba = t.innerWidth() || o.innerWidth || 400;
            za = t.innerHeight() || o.innerHeight || 400;
            a("a.active", n).is('[data-viewport="auto"]') && z()
        }).on("beforeunload", function() {
            M.click()
        });
        y.updateDeviceList = function(b) {
            na(b);
            oa();
            qa()
        };
        y.updateColorAffinity =
            function() {
                ra()
            }
    })
})(window, document);
<iframe id="content" name="content" frameborder="0" src="http://alvarovarejao.com"></iframe>

0 个答案:

没有答案