
<body> <div ID="parent"> <div ID="child"></div> </div></body>
父div的宽度为900,高度为800
我希望子div位于父div的右上角,因此,我为子div定义CSS如下:
#child { position: absolute; top: 0; right: 0; wIDth: 300px; height: 30px;} CSS很好,它使子div位于父div的右上角.
但是,如果我更改(更小)浏览器窗口大小,则子div在某个时刻消失(隐藏).
如何使孩子div始终可见但仍然位于
在父div的右上角,无论浏览器窗口大小如何变化?
#parent { position: relative; wIDth: 900px; height: 800px;}#child { position: absolute; top: 0; right: 0; wIDth: 300px; height: 30px;} 编辑:我误解了你的要求,现在当我读到它时,我发现你希望孩子div在页面上保持可见,不管是什么,而不仅仅是在父母的左上角.为此,您需要绑定到窗口调整大小事件,并在窗口宽度小于父宽度时更改子div的位置.通过差异改变正确的位置.
好的,这是jquery会做我认为你要求它做的事情:
$(function(){ $(window).resize(function(){ var delta = parseInt($('#parent').wIDth(),10) - parseInt($(window).wIDth(),10); if (delta > 0) { $('#child').CSS('right',delta); } }); }); 两件事情:
>如果您快速调整窗口大小,子div不会总是返回到最右侧.我不确定这是否是一个时间问题,所获得的窗口的宽度是在它实际上移动得更远或什么之后,但是当你慢慢地调整大小时这会更好,这让我相信有更好的方法来做到这一点.>如果打开窗口使得它太小而无法首先看到子div,则不会处理移动子div.这可以使用相同的技术轻松修复,以找到子div的最佳位置,但只是在页面加载时而不是在调整大小时.
总结以上是内存溢出为你收集整理的html – 当浏览器窗口大小改变时如何使子div可见?全部内容,希望文章能够帮你解决html – 当浏览器窗口大小改变时如何使子div可见?所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)