如何制作gfy全屏？

问题描述：

我无法调整我的gfy的大小。我希望他们占用100％的视口。我假设我没有选择正确的课程或ID。我检查了这个元素。我只是不确定该从哪里出发。我尝试了全屏。我认为我的问题是我没有从他们的样式表中选择正确的类，但我很茫然。我感谢任何帮助。如何制作gfy全屏？

<body> 
    <div class="gfy" data-key="65"> 
     <img class="gfyitem" data-id="SafeSevereAustralianfreshwatercrocodile" data-controls="false" data-dot="false" data-perimeter="true" data-expand="true"> 
    </div>   
</body>

相关CSS：

.gfy { 
    position: fixed; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    background-position: center center; 
    background-color: black; 
    background-size: cover; 
    display: none; 
} 

.gfyitem { 
    margin: 0; 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    margin-right: -50%; 
    transform: translate(-50%, -50%) 
}

什么是gfy？ – j08691

尝试将html＆body height设置为100％。如果身体内唯一的元素是固定的，没有任何东西给身体任何高度 – charlietfl

谢谢，@charlietfl。我的身体和HTML设置为100％。我想知道是否有一个硬编码（是否是正确的术语？也许我的意思是内联样式），我需要改变gfy中的CSS。 – Rachel

答

我希望这可以帮助别人！

<div class="gfy" data-key="90"> 
    <img class="gfyitem" data-id="VibrantAncientAmericanbulldog" data-controls="false" data-dot="false" data-perimeter="true" data-expand="true" data-filetype="image"> 
</div> 


$(window).on('keydown', function(e) { 
    $('[data-key="' + e.which + '"]').show(); 
    $('#letter-key').html(String.fromCharCode(event.keyCode)).show(); 
});

如何制作gfy全屏？

相关推荐