哈弗不按预期工作

时间:2016-05-02 18:29:57

标签: html css hover

问题在于,当我将鼠标悬停在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/ 对不起我的英语不好。 谢谢你的帮助!

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