我在一个绝对盒子里面玩一个弹性盒时会遇到一些问题,这个盒子位于一个定义的高度div内(我将在此处解释).
首先,这里是我演示的小提琴,可能更容易理解问题:https: //jsfiddle.net/8ub9tyub/
如您所见,当您悬停块时,文本从下方显示但不完全显示.
我有一个主要div(让我们称之为$ main)用于悬停部分,600x250px带有一个overflow: hidden
,并且里面有两个div:标题和文本(比如$ title和$ text),它们相互出现(常规流程) .
$ title有时会占用两行,因此其高度设置为auto.
$ text设置为100%高度,以相对值设置并设置为display: flex
.在里面是另一个div($ intro)我定位在绝对位置,a top: 100%
(在悬停时切换为0)和a align-self: flex-end
以保持在$ main的底部.(这是为了防止文字粘在标题上 - 我喜欢呼吸)
结构是这样的,基本上:
<div class="main">
<div class="title">I'm a title!</div>
<div class="text">
<div class="intro"><p>Just a bunch of long paragraphs of text</p></div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
现在,正如你在我的演示中所看到的那样,$ text的高度设置为100%,但我预计高度为$ main 减去 $ title的高度,但这里似乎只是$ main的高度,这使$ text块溢出,因此当我将鼠标悬停在文本 …
我有一个应用程序可以进行很多异步操作fetch
调用,其中一些是相同的。
我有一个超集函数fetch
(例如fetchPlus
),通过根据参数为每个请求创建一个伪唯一标识符。这样,我就可以存储结果sessionStorage
并访问它。
function fetchCacheStore(hash) {\n const storeItem = \'fetch_\' + hash;\n return {\n getCache: function () {\n return JSON.parse(sessionStorage.getItem(storeItem));\n },\n\n setCache: function (data) {\n sessionStorage.setItem(storeItem, JSON.stringify(data));\n setTimeout(function () { sessionStorage.removeItem(storeItem); }, 25); // Clear the cache item shortly after\n },\n };\n}\n\nfunction fetchPlus() {\n const stringHasher = function (s) { // Adapted from /sf/ask/533152301/#comment94234739_7616484\n for (var i = h = 0; i < s.length; i++) {\n h = Math.imul(31, h) + …
Run Code Online (Sandbox Code Playgroud)