如何在不裁剪大圖像的情況下使圖像成爲全屏

Question

我在ember app中使用了ember-fullscreen插件。我在全屏中顯示圖像（就像facebook一樣）。我面臨的問題是如果圖像是然後我無法看到完整的圖像。只有圖像的一部分被顯示出來。但在Facebook中無論圖像的尺寸如何，它們都能夠以全屏模式顯示完整圖像。如何我在呃應用程序中這樣做。

component.js

import Ember from 'ember'; 

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

}); 

template.hbs

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

我應該怎麼做，這樣它應該能夠在全屏mode.Thanks時顯示屏幕尺寸內的整個圖像毫不誇張地說。

Answer 1

如果您對照片中的固定寬度/高度，請嘗試通過改變CSS的照片，以類似的東西動態調整：

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