Question

如何通过Fancybox将图像完全拉伸到窗口？（Fancybox 2） fancybox的尺寸与图像尺寸一样大，但没有更多。

我注意到fancybox css中存在许多CSS限制，例如：

.fancybox-image, .fancybox-iframe {
    display: block;
    width: 100%;
    height: 100%;
}

.fancybox-image {
    max-width: 100%;
    max-height: 100%;
}

取出max-width/height并设置让我们说width/height到200%会拉伸图像，但包含的矩形本身（即：fancybox）的大小相同，它是不再居中。

我正在使用内联方法，例如：jQuery(".fancybox").fancybox()

Answer 1

i-pretty-much-up-up-for-for-cool-but-useless-stuff方法：

.fancybox({
 afterLoad  : function () {
  function gcd (x, y) {while (y != 0) {var z = x % y; x = y; y = z;} return x}
  var body = $(document.body)
  if (this.width/this.height > 1) {
   // Max size is document body width.
   var body_width = body.width()
   var current_multiplier = gcd (this.width, body_width)
   if (current_multiplier == 1) current_multiplier = body_width
  } else {
   // Max size is document body height.
   var body_height = body.height()
   var current_multiplier = gcd (this.height, body_height)
   if (current_multiplier == 1) current_multiplier = body_height
  }
  this.width  = this.width  * current_multiplier
  this.height = this.height * current_multiplier
 }
})

将小图像拉伸到窗口

1 个答案: