问题在于,当我将鼠标悬停在li上时,悬停不起作用,第一个它可以工作,但悬停区域与div的大小不同。
这是一个不带javascript的复选框。
这是HTML
<input type="checkbox" id="sidebartoggler">
<div id="page-wrap">
<label for="sidebartoggler" id="toggle">☰</label>
<div id="sidebar">
<ul class="elements">
<li>Str. Glowna</li>
<li>Wyb. przedmiotu</li>
</ul>
</div>
<div class="page-content">
和CSS
.page-content
{
position: relative;
z-index: 0;
transition: padding-left 0.5s;
}
#chose
{
font-size: 40px;
text-align: center;
margin: 5% 0 5% 0;
}
#sidebar
{
position: fixed;
left:-190px;
right: 0;
top: 0px;
bottom:0px;
width: 170px;
padding: 10px;
background: #333;
transition: left 0.5s;
display: inline-block;
}
#toggle
{
position: fixed;
left:20px;
top: 15px;
font-size: 30px;
transition: left 0.5s;
}
#sidebartoggler
{
display: none;
}
#sidebartoggler:checked + #page-wrap #sidebar
{
left:0px;
}
#sidebartoggler:checked + #page-wrap #toggle
{
left:200px;
}
#sidebartoggler:checked + #page-wrap .page-content
{
padding-left: 180px;
}
.page-content
{
padding-left: 0px;
}
#sidebar ul
{
font-size: 15px;
list-style: none;
list-style-position: inside;
width: 170px;
margin: 20px 0 0 -40px;
text-align: center;
}
#sidebar ul > li
{
padding: 10px 0;
margin: 5px 0 0 0;
background-color: #444;
display: block;
}
#sidebar ul > li:hover
{
background-color: #555
}
在这里您可以看到完整的代码:https://jsfiddle.net/2hnLyjw4/1/ 对不起我的英语不好。 谢谢你的帮助!
答案 0 :(得分:1)
问题是您在import numpy as np
from scipy.spatial import cKDTree
tree = cKDTree(points)
rows_to_fuse = tree.query_pairs(r=30)
print(repr(rows_to_fuse))
# {(8, 9)}
print(repr(points[list(rows_to_fuse)]))
# array([[ 820.57417943, 84.27702407],
# [ 806.71416007, 108.50307828]])
上使用padding-left
;这会导致内容根据需要向右移动,但div部分位于菜单顶部并干扰悬停事件。
将其更改为使用.page-content
:
margin-left