我创建了一个始终位于顶部的div
.visibleDiv, #topLeft { position: fixed; width: 150px; border: solid 1px #e1e1e1; vertical-align: middle; background: #ffdab9; text-align: center; } #topLeft { top: 10px; left: 10px; } 我这样显示它
Top Left
但我也有一个叫做容器的div。 我希望topLeft留在该容器的左上角而不是屏幕的左上角。 我对css很陌生，一直在摸索如何实现这样的效果。
所以为了更清楚地解释，我想尝试达到这个效果
______________ |Other things| |____________| ________________________________ | TOP LEFT MESSAGE| | |_________________| | | | | | | CONTAINER DIV | | | | |
当你向下滚动时，我希望topleft在容器选项卡中位于屏幕的左上角，就像这样
|__________________ | | TOP LEFT MESSAGE| | |_________________| | | | | | | CONTAINER DIV | | | | | |______________________________|
如果有人能指出我正确的方向或告诉我如何通过解释实现这一点，我将非常感激。 感谢任何人提前帮助或只是阅读这篇文章。
只需添加位置：相对于容器元素。
看到这个小提琴
更新
jQuery在这里非常有用。 您可以使用它轻松计算“容器”何时到达视图端口的顶部，然后将类重新分配给“topLeft”元素以修复它。
HTML
Some Stuff Top Left Stuff Container Stuff
CSS
.container { background-color:#FAA; height:1000px; } #topLeft { width: 150px; border: solid 1px #e1e1e1; vertical-align: middle; background: #ffdab9; text-align: center; } .fixit { position:fixed; top: 0px; }
使用Javascript
在这里看到它
这是一个小提琴https://jsfiddle.net/TSfLu/
左上方的消息将始终位于该位置并覆盖其下方的任何内容。 因此，您可能希望相应地在页面上定位内容。
以上就是jQuery教程分享始终在区域内的顶部div相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。
本文来自网络收集，不代表计算机技术网立场，如涉及侵权请联系管理员删除。
ctvol管理联系方式QQ:251552304
本文章地址：https://www.ctvol.com/jquerytutorial/524578.html