Javascript 使用css隐藏对象

当鼠标不在网格的边界内时，我试图隐藏我在jQuery Flot图中创建的垂直条。我将网格的水平边界设置为：

horizontalBounds=[leftOffset，plot.width（）+leftOffset]。然后我使用if语句说“如果鼠标在垂直边界内，请对verticalBar.css执行此操作。”

尝试在CSS中使用“display:none；”。
根据您想要隐藏栏的方式，您可以使用类似于
display:none
的简单方法

如果您想添加一些动画，可以使用一些jQuery函数来控制特定节点

您还可以利用一组CSS类名交换来触发一些CSS动画。
因此这些方法似乎都不适合我。我最终发现Flot有一个crosshair插件（Flot.crosshair）。十字线可以配置为仅作用于x轴/x坐标，因为它跟踪鼠标的移动。下面是一个正在运行的十字线跟踪示例：。
一旦插件被添加，我就能够得到想要的结果；因为“垂直条”仅在光标位于网格上时显示。下面是配置它所需的全部操作（除了将插件添加到适当的文件中）。希望这对将来的人有所帮助

 plot = $.plot(
                placeholder
                data
                grid:
                    clickable: true
                    hoverable: true
                    color: "white"
                    mouseActiveRadius: 1000
                tooltip:
                    show: true
                    content: '%y'

                crosshair:
                    mode: "x"
                    color: "#FFFFFF"
                    lineWidth: 1

请用适当的标签标记你的文章-至少jQuery标签是必要的。我也不觉得你的问题很清楚-你不使用
：hover
的原因是什么？另外，添加
可见性：hidden
可以通过.css（）函数正常工作……css没有任何“垂直”或“水平”鼠标限制。它有“mouseover”，它适用于任何始终为矩形的元素。@MarcB:CSS没有“mouseover”，它有
：hover
-这绝不是始终为矩形，而是取决于对象的边界。@third man:是的。。。悬停米巴德。星期一早上不，是的，但我希望鼠标在网格范围内时显示它。假设我要在上面的第二个
if
语句中添加一个
else
语句。如何将
display:none
添加到css？
verticalBar.css({
              backgroundColor: "#F7E4E6",
              width: "1px",
              height: "100%",
              position: "absolute",
              padding: 0,
              margin: 0,
              left: 0,
              transform: "translateX(" + plot.getPlotOffset().left + "px)"
            });
          }

 plot = $.plot(
                placeholder
                data
                grid:
                    clickable: true
                    hoverable: true
                    color: "white"
                    mouseActiveRadius: 1000
                tooltip:
                    show: true
                    content: '%y'

                crosshair:
                    mode: "x"
                    color: "#FFFFFF"
                    lineWidth: 1