如何在不裁剪大图像的情况下使图像全屏答案

【问题标题】：How to make the image fullscreen without making cropping the big images如何在不裁剪大图像的情况下使图像全屏
【发布时间】：2016-03-15 09:30:45
【问题描述】：

我在 ember 应用程序中使用 ember-fullscreen 插件。我正在全屏显示图像（就像 facebook 一样。）我面临的问题是图像的尺寸是否很大。然后我看不到完整图像。仅显示图像的一部分。但是在 Facebook 中，无论图像的尺寸如何。他们都能够以全屏模式显示完整图像。我应该如何在 ember 应用程序中做到这一点。

component.js

import Ember from 'ember';

export default Ember.Component.extend({
  tagName: 'img',
  attributeBindings: ['src', 'width', 'height'],

});

模板.hbs

{{#if fullscreen.isEnabled}}
    {{full-screen src=photo.photo_url}}
{{/if}}

我应该怎么做才能在全屏模式下在屏幕尺寸内显示整个图像。谢谢。

【问题讨论】：

标签： ember.js ember-cli ember-cli-addons

【解决方案1】：

如果您有固定的照片宽度/高度，请尝试通过将照片的 CSS 更改为以下内容来使其动态调整大小：

.my-photo {
    ...
    height:100%;
    width:100%;
    ...
}

【讨论】：