当用户在移动设备上填写表单时,我试图隐藏一个div,这样由于键盘显示,屏幕可以更加可见。
HTML
<div id="fixed-bottom-menu">BLA BLA BLA</div>
当移动键盘被隐藏时,JS代码必须再次显示div。
我的尝试:
<script type="text/javascript">
if( $(window).width() < 60%)
{
document.write( '<style>"#fixed-bottom-menu"{visibility:hidden}</style>' );
}
</script>
你需要一个eventlistner来做这件事,%不应该在那里,你需要检查当前视口高度比总屏幕大小少40%,以便使它工作
如果您正在使用document.write(),它将从脚本中删除jquery.使用document.write()是不可取的
请查看https://jsfiddle.net/anirudhsanthosh/hrsd8o5p
使用jquery.css()方法更改元素的css属性
<script type="text/javascript">
$(window).resize(()=>{
if(( window.innerHeight/screen.availHeight)*100 < 60)
{
$('#fixed-bottom-menu').css({display:"none"})
return
}
$('#fixed-bottom-menu').css({display:"block"})
})
</script>