0

这是一个简单的脚本,用于调整 iframe、图像和嵌入的大小以适应移动设备的窗口。我遇到的问题是它不会在页面加载时运行,而是仅在您刷新或调整窗口大小时运行。我已经在 Firefox 和 Chrome 中进行了测试,所以我猜这不是浏览器的问题,而是代码的问题。

在下面的脚本之前,我正在从 Google 加载 jQuery 1.7.2 以及 jQuery Mobile 1.1.0。

 $(window).bind("load", resizeMobile);
 $(window).bind("resize", resizeMobile);

  function resizeMobile() {
    var h = $(window).height();
    var w = ($(window).width() - 30);
    var max_size = w;
    $("embed, iframe, img").each(function (i) {
      if ($(this).height() > $(this).width()) {
        var h = max_size;
        var w = Math.ceil($(this).width() / $(this).height() * max_size);
      } else {
        var w = max_size;
        var h = Math.ceil($(this).height() / $(this).width() * max_size);
      }
      var url = $(this).attr('src');
      //handle ih embeds
      if (url.indexOf("/player/embed.html") > 0) {
        $(this).attr("height", h).attr("width", w);
        $(this).attr("src", $(this).attr("src")); //reload iframe to set new width and height
      } else {
        //$(this).attr("height", h).attr("width", w);
        $(this).css({
          height: h,
          width: w
        });
      }
    });
  }

  $(document).ready(resizeMobile);
4

0 回答 0