1回答
大家好，我在svg基础地图上工作，我在其中突出显示了一些特定的位置，当用户鼠标悬停在它上面时，它会弹出位置的名称和颜色变化，现在我的客户需要投影效果，当用户鼠标悬停在它上面时，它的颜色变化和投影效果也适用。这是我的代码。
svg代码
<path id="Middle East Region" class="enabled" fill="#21669E" stroke="#FFFFFF" stroke-width="0.75" d=""</path>
<script>
浏览 9提问于2017-02-20得票数 1
所以我有一个单独的.svg文件，带有一些预先制作的渐变效果，如下所示：
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="1052.4" width="744.09" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/
浏览 0提问于2013-02-08得票数 7
我有一个SVG地图，当鼠标移到地图的某个区域时，我想要更改侧面板上的文本。我想将文本更改为包含鼠标所在区域的锚点的类名。目前，每当我将鼠标悬停在地图上时，它都会在侧面板中返回未定义的内容。
我尝试将代码设置为仅在类名不等于nil时才起作用，但该函数没有触发，因此我一定不会在鼠标悬停时获得锚点标记。
HTML (删除不相关的代码)
<p onmouseover="houseQuickOverview()">
<svg ... >
<g id="G_Areas" ... >
<
浏览 19提问于2019-07-16得票数 0
回答已采纳
我正在使用D3 JavaScript库来构建一个SVG图，并将鼠标事件分配给它们。SVG图可能很复杂，由许多任意路径元素组成。我一直在努力找出一种方法来确定鼠标悬停事件中所有附近的元素。因此，例如，当鼠标光标移动到图上时，我可以确定距离光标N个像素半径内的所有组件SVG元素。
我完全被如何解决这个问题难住了。我甚至不确定是否有API允许我确定SVG组成元素是否在边界区域内？
任何关于如何解决这个问题的提示都将不胜感激。
浏览 0提问于2012-09-29得票数 8
3回答
在使用Chart.js库时，我希望在将鼠标悬停在甜甜圈上时更改光标。
我这样做：
$("#dc_LoadTime").mouseleave(function(){
$("#dc_LoadTime").css("cursor", "default");
});
$("#dc_LoadTime").mouseenter(function(){
$("#dc_LoadTime").css("cursor", "pointer");
});
在html页面中
浏览 0提问于2016-02-22得票数 8
回答已采纳
6回答
我有一个奇怪的问题，在safari中svg在悬停时调整大小。我正在使用jquery的悬停功能将页面上的svg替换为稍有不同的svg。这项工作在所有浏览器中都是正确的，除了safari，由于某种原因，safari会在鼠标悬停和鼠标输出时完全调整svg的大小。
我的svg高度是在css中设置的
img.svg-graphic {
height: 180px;
}
并在页面上显示为图像
<div class="container">
<img class="svg-graphic" src="svg-icons/version1.sv
浏览 17提问于2014-02-04得票数 7
1回答
我有这个；
它在没有CSS的这部分的情况下工作得很好(第78行)；
svg {
-webkit-filter: drop-shadow( 1px 1px 5px #000 );
}
但是，当它是有严重的性能问题(急转率)与动画上的:悬停状态的平铺。
这是一个已知的性能问题，还是我错误地应用了投影？我已经尝试将其专门放在每个SVG上，但也无济于事。
感谢您的任何帮助，
谢谢!
浏览 2提问于2013-10-24得票数 3
1回答
鼠标悬停时的CSS1雪碧图动画？
、、、、
我知道如果我将鼠标悬停在CSS1雪碧图上，它会切换到悬停图像，但有没有办法让它在鼠标悬停时按顺序加载更多图像，就像动画一样？请注意，没有CSS3响应，并不是所有浏览器都完全支持CSS3动画。谢谢
浏览 6提问于2013-12-09得票数 0
1回答
我有一个ListView控件，它有封面图片，海报，类似于这个应用程序：
我正在尝试获得相同的蓝色发光鼠标悬停效果。
对如何实现这一点有什么想法吗？
浏览 1提问于2011-03-10得票数 3
回答已采纳
2回答
因此，我有下面的React组件，它在我的例子中充当导航栏。每当用户将鼠标悬停在导航栏项目上时，它必须将其颜色更改为指定的颜色。目前，导航栏项目由2个项目组成:图标(SVG)和描述它是什么的文本。
因此，将鼠标悬停在组件上必须同时更改文本和图标的颜色。
下面是当前的代码：
import { ReactComponent as DashboardIcon } from "../assets/ico_dashboard.svg";
<div className="navBar">
<ul className="nav-links"
浏览 2提问于2020-03-21得票数 0
2回答
我需要在相应的位置显示值，同时使用d3.js将鼠标放在线条/条形图上
var toolTip = svg.selectAll("path")
.append("svg:title")
.text(getmouseoverdata(data)
);
function getmouseoverdata(d) {
return d;
}
在这里，我获得了数组中的所有数据，同时鼠标悬停在图中的任何位置。
但是我想在相应的位置显示这个值。我怎样才能做到这一点？
浏览 11提问于2013-04-15得票数 1
回答已采纳
我有一个由多边形组成的svg地图。在多边形悬停时，有一个显示国家名称的工具提示。同样，每个多边形都有一个代表大写的圆，并且在悬停时显示名称。我想让鼠标在地图上绘制选项(曲线，直线，圆，矩形...)因此，我在svg的foreignObject中使用了canvas。
Svg在html中作为对象：
<object id="map" type="image/svg+xml"></object>
Canvas在foreignObject内部的svg中：
<foreignObject height="988" width=
浏览 33提问于2019-07-24得票数 0
回答已采纳
2回答
我有一个SVG图形，如下所示：
a::before { content: url(filename.svg); }
当我将鼠标悬停在标记上时，我真的希望SVG更改填充颜色，而无需加载新的SVG文件，就像我现在所做的：
a:hover::before { content: url(filename_white.svg); }
有没有可能用JavaScript，jQuery或者我不知道的纯CSS来实现呢？
谢谢。
浏览 2提问于2014-02-02得票数 65
回答已采纳
2回答
我目前正在使用d3.js进行可视化。请看一下。(这是一个dropbox链接，您可能必须允许它加载。)
我已经创建了一个函数，当鼠标悬停在地图上的一个点上时，每个重叠元素的大小都会增加。
请尝试以下用例: 1.单击美国放大到国家/地区。2.将鼠标指针拖动并平移到纽约，然后将鼠标指针悬停在该点上。
如果一切顺利，您应该会看到一个巨大的圆，其中嵌入了多个同心圆。它们都是在特定坐标下的重叠元素。
我面临的问题是，当SVG元素的大小增加时，其他城市的点会重叠在同心圆的顶部。
我的问题是:当我将鼠标悬停在SVG画布上时，如何画出圆圈，这样就看不到这样的点了。
浏览 1提问于2013-01-02得票数 2
回答已采纳
我在css中创建了一个效果，当用户将鼠标悬停在文本上时，一行看起来就好像是一个下划线，当鼠标悬停在它上面时，它会增加，当用户将鼠标从文本上移开时，它会减少。问题是，我想在这个文本旁边显示一个图标，当下划线出现并消失时，图标就会出现。如果我把显示:块，下划线的效果，当鼠标悬停在它上面时不会发生。我怎么解决这个问题？
css：
/* You can add global styles to this file, and also import other style files */
.navbar {
display: flex;
flex-direction: row;
浏览 3提问于2022-11-25得票数 0
2回答
如何在网页中显示dwg
、、、、
我有一个想要在网页上显示的dwg文件(如果需要，我可以将文件格式更改为svg或其他格式)。在此文件显示在页面上后，我希望能够放大，缩小，平移和放置链接，请求api在必要的地方。事实上，当你将鼠标悬停在谷歌地图上的地标上时，关于相关地点的信息和链接看起来就会出现。
我该如何着手做这项工作呢？
浏览 17提问于2021-08-26得票数 1
有人知道当鼠标光标悬停在链接上时，如何改变链接的颜色和移除按钮吗？
JointJS的形状似乎是SVG，所以如果我错了，请纠正我，但我不认为我可以使用CSS来做到这一点…
浏览 30提问于2019-11-11得票数 1
1回答
当我运行Ubuntu18.04时，当鼠标悬停在码头上时，我使用了答案这里来禁用工具提示。在升级到Ubuntu20.04之后，该解决方案不再起作用。
是否有解决办法来禁用Dock的工具提示，如下图所示？
📷
编辑:如果有关系的话，我正在使用Yaru主题：
📷
以下是/usr/share/gnome-shell/theme的内容：
├── calendar-today.svg
├── classic-process-working.svg
├── classic-toggle-off-intl.svg
├── classic-toggle-off-us.svg
├── classic-toggle
浏览 0提问于2020-07-01得票数 5
回答已采纳
1回答
在iphone上可以使用鼠标悬停类型的功能吗？我正在尝试为一个基本的区域图像地图编写代码，但无法使用鼠标悬停来实现悬停功能。只是想在用户手指在地图上拖动时切换图像。
感谢您提出的任何建议。
谢谢，保罗
浏览 0提问于2011-01-10得票数 0
回答已采纳
1回答
我制作了一个演示
问题是鼠标到达视图框时已经触发了悬停效应。我希望只有当鼠标超出线本身的路径时才会发生这种情况。
CSS悬停样式：
svg:hover path#path-1{
stroke: orange !important;
}
这条线是用插画制作的。
浏览 4提问于2017-10-23得票数 2
回答已采纳
1回答
我正在尝试制作一个文件夹，将鼠标悬停在缩略图上会使整个图片从左边滑入。所有用于动画的css3代码都在应用代码的对象上工作，但我想要的是，您将鼠标悬停在一个对象上，动画就会在另一个对象上发生……我是个菜鸟，我只想要我自己的相册，所以如果有人能帮我一点忙，我会很高兴的！谢谢。
浏览 2提问于2015-07-01得票数 0
在用D3显示我的地图后，我需要在地图上放置客户位置。这样做没有问题，但是当用户单击我的客户位置时，我需要显示当前在属性成员中保存的位置的数据。现在，当我console.log()选择的客户位置时，我得到了整个特性数据，而不是用户选择的单个特性数据。这是我的客户位置数据：
var customerListData =
{
"type":"FeatureCollection",
"features":[
{
"geometry":{"type": "Point",
浏览 0提问于2013-12-06得票数 0
回答已采纳
我使用Googles GWT创建了一个带有折叠子菜单的，如下例所示：
将鼠标悬停在MenuItem上将打开一个子菜单。子菜单放置了一个非css3的阴影，它不适合我的ui设计，因为我使用了一个不同样式的css3框阴影。
乍一看，似乎无法在某些属性中禁用此阴影。有没有人知道怎么做？
浏览 3提问于2011-04-12得票数 3
回答已采纳
2回答
我有两个SVG矩形，其中一个逻辑上在x和y位置上位于另一个之上。现在，当您将鼠标悬停在顶部的rect上时，我希望它下面的rect成为事件的目标。但是如果我在上面的矩形上按下鼠标，我希望它成为目标。
这种基于事件类型的不同功能使得css的“指针事件”属性对我来说没有用处。
我如何才能做到这一点呢？
浏览 0提问于2010-09-30得票数 0
回答已采纳
我有一个带有jquery的inkscape SVG文件，我正在尝试对它应用一组CSS选择器，以确保特定层的项都具有统一的颜色，并允许在某些层上执行鼠标切换效果。它似乎没有任何问题尊重SVG上的标准CSS规则，但完全忽略了使用[attribute="value"]选择器的任何内容，例如：
svg g path:hover {
fill: yellow !important;
stroke-width: 4px !important;
}
但是，如预期的那样，在鼠标移动时将应用这些效果：
svg g[inkscape\:label="footprint
浏览 0提问于2015-04-07得票数 4
回答已采纳
1回答
我有以下HTML：
<a href="/">
<svg viewBox="0 0 100 100">
<circle cx="50" cy="50" r="48"/>
<text y=72>
<tspan x=50 text-anchor="middle">Hello World</tspan>
</text>
</svg&
浏览 0提问于2016-09-21得票数 2
回答已采纳
5回答
请原谅我的无知，SVG对我来说是很新的。我试图在我的内联SVG中的一组元素上得到一个悬停效果。每一组元素都是一组紧密定位的圆圈。我可以实现这种悬停效果与css，但显然这将只有当鼠标定位在一个圆圈。我想要的是当鼠标覆盖包含圆圈的整个区域时的效果，所以空间和圆圈结合在一起。
<style>
svg {
height: 220px;
width: 400px;
background: grey;
}
.na circle,
.as circle {
fill: white;
}
.na:hover circle {
fill: blue;
}
</style
浏览 2提问于2013-10-08得票数 23
回答已采纳
2回答
我有一个几何形状，我想要填写，如图所示
当鼠标悬停在每个区域上时，我希望它被填充，如图所示。
不幸的是，当我添加其余的形状时，我的代码无法工作，因为我的浏览器为每个形状提供了一个覆盖其余形状的边界框。如何才能使我的svg的鼠标悬停形状精确，而不是一个方框？
下面是我的HTML代码：
<object data="images/logo/middle.svg"
type="image/svg+xml" class="middlesvg hoversvg" > <!-- only the middle is sh
浏览 3提问于2013-07-16得票数 0
2回答
具有仅使用stroke-dasharray的线(或路径)的SVG似乎在用户将鼠标悬停在虚线的实线部分时触发CSS和JS悬停事件：
有没有一种简单的方法可以让JS和CSS事件在行的实心或不可见部分悬停时触发？
我目前的计划是沿着相同的路径绘制第二条不可见的线，并使用它来检测鼠标事件。，这看起来很重，我希望有一种更清晰的方式，我错过了。
浏览 13提问于2018-02-01得票数 2
回答已采纳
这有点难以解释，所以让我们看看：。
我正在使用一个带有css悬停功能的svg地图，我试图让底部的链接使国家/地区具有悬停效果。另外，我也希望它能正常工作，反之亦然，所以当你在这个国家悬停时，它也会更新链接(出于某种原因，这不起作用，有什么想法吗？)
然而，主要的问题是，当你将鼠标悬停在第一个中国链接上后，它会阻止你看到它再次点亮的国家的悬停效果(是的，我知道，它是泰国，而不是中国)。
这是我正在使用的代码。每个国家都是一个多边形，并且将有自己的id，以及每个li链接：
<script>
$('#list_china').hover(function(){
浏览 0提问于2013-05-03得票数 1
1回答
突出显示值并保存
、、、、
我正在使用plots来缩放我的图，保存到svg，并向客户显示最有趣的间隔。我不能到达的东西--我需要用鼠标悬停显示数值来保存图片。 例如，我缩放，我指向我需要显示的值，我使用悬停查看值。 ? 但是当我按下"Download plot“按钮时，它会被保存，没有悬停信息。下面是我在svg中看到的内容： ? 如何在保存的绘图上显示值？ 下面是我的示例代码： library(plotly)
x <- c(1:100)
random_y <- rnorm(100, mean = 0)
data <- data.frame(x, random_y)
fig
浏览 24提问于2021-08-05得票数 0
我有一个透明图像(PNG)的ImageView，因此图像不会填满图像视图的整个矩形，当鼠标悬停在图像视图上时，我只想更改图像视图的矩形的背景颜色。在Css中我是怎么做的？图像视图节点是否具有属性-fx-background颜色？我试过了，但对我不起作用。我有一个css文件链接到.FXML
浏览 1提问于2015-10-15得票数 2
1回答
我有一组two.js形状。当用户在形状上盘旋时，我希望那个形状旋转。
css动画的问题:如果我将a：动画应用于svg形状，它会以某种方式影响形状的位置，将其移动到左上角。
所以我试图把一个鼠标事件绑定到每个孩子身上，让他们旋转。
var shapes = makeFlowers();
for (var r = 0; r < rows; r++) {
for (var c = 0; c < cols; c++) {
...
var shape = pickFlower();
shape.translation.set(hi * two.width, v
浏览 0提问于2019-01-02得票数 0
1回答
我正在做一个SVG美国地图，我想显示一个小的信息窗口指向每个州，当你悬停在它上面，显示人口，类似于谷歌地图上的信息窗口。不幸的是，我对JSON不是很在行，所以我只能停留在这一点上。
目前，我有美国的SVG地图上和填充颜色变化悬停通过CSS。我有一组JSON数据样本，我想知道如何将它合并到地图中，以便在悬停时显示总体情况。
下面是JSON数据的一个示例：
[
{
"id":"AL",
"population":"253045"
},
{
"id":"AR",
浏览 0提问于2016-02-04得票数 0
回答已采纳
1回答
我在地图上添加了一些圆圈，希望在地图上盘旋时，圆圈从黑色变为橙色。我尝试过两种不同的方法：
css:循环:悬停{填充:橙}
的鼠标操作事件。部分鼠标操作(例如，我可以更改圆圈的半径)，但是将填充设置为不同的颜色是行不通的。知道为什么吗？
浏览 0提问于2021-03-27得票数 0
4回答
我有一个SVG作为提交按钮。我希望SVG的按钮从鼠标悬停变成蓝色。我下面的代码似乎不能工作。HTML
<div class="icon-cnt" id="search-icon">
<input type="image" src="assets/images/search-fill-2.svg" border="0" alt="Submit" id="submit svg-hover"/>
</div>
这是我的CSS
#svg-hover:h
浏览 4提问于2017-03-15得票数 1
1回答
使用SVG图标比png/gif图标有很多优点。因此，我希望实现一个svg按钮类来充当gwt小部件。GXT 3中是否已经有什么东西存在？或者，实现这样一个小部件的最佳选择是什么？谢谢。
更多详情：
我需要一个纯可点击的svg图标，就像一个按钮小部件。它需要有鼠标点击处理程序和能力应用不同的css在三种状态:正常，悬停，禁用。我不想要一个按钮与svg图标在里面。
浏览 2提问于2016-01-11得票数 1
1回答
我正在尝试添加一些在悬停时应该会改变颜色的社交媒体按钮，我在svg标签中有一个圆圈，当我尝试添加悬停时，如果我将鼠标放在圆圈的“边界”上，它就会起作用。这是网页地址。
<svg>
<circle cx="50%" cy="50%" r="20" fill=#009ddf />
<image x="20%" y="23%" width="30" height="30" xlink:href="images/svg/facebook.sv
浏览 12提问于2017-02-07得票数 2
回答已采纳
请看一下这个链接，。
我正在尝试实现一个css3悬停动画效果，当鼠标悬停在缩略图上时，黑色覆盖了要单击的carot动画。此时，当您将鼠标悬停在图像上时，什么也没有发生。但是，如果您删除html代码第3行的IMG标记，它就可以正常工作。如何使用图像使其具有动画效果？非常感谢您的帮助！
浏览 0提问于2013-12-10得票数 1
1回答
我试图在悬停时设置svg更改颜色的特定路径，但我的代码似乎有些问题。例如，当我试图添加一个内联.svg圆圈时，它甚至不会出现，尽管文本会出现。悬停根本不起作用，我试过几种不同的方法。
这是我的HTML：
<html>
<head>
<link rel="stylesheet" href="styles.css">
<title>User Map</title>
</head>
<body>
<div id="map">
<im
浏览 1提问于2018-07-12得票数 1
回答已采纳
2回答
我的站点中有一个svg图像元素。我想把这张照片藏在鼠标架上，然后显示在鼠标上。
但是，我有一个奇怪的问题，图像闪烁在鼠标上方.
我试图通过css和jquery隐藏图像。在这两种方法中，我都遇到了相同的错误。
SVG
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<image x="20" y="20" class="imghideshow" width="300" height="80"
浏览 3提问于2013-03-15得票数 6
回答已采纳
4回答
在这段SVG (在FF 8，Safari 5.1.2，Chrome 16，都在Mac上尝试过)中，当鼠标移动到工具栏上时，没有一个浏览器正确地检测到每个鼠标悬停/输出事件，有时它不起作用。但是它在所有浏览器中都是一致的，所以可能与SVG代码有关。使用onmouseover和onmouseout会得到相同的结果--不能正常工作。
在悬停时实现SVG rectangles的正确方法是什么？
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="h
浏览 0提问于2012-02-09得票数 33
回答已采纳
1回答
我通过js访问svg。
<script type="text/javascript">
$(function(){
$("#stage").load('img/europa_regionen.svg',function(response){
$(this).addClass("svgLoaded");
if(!response){
// Error loading SVG!
// Make absol
浏览 4提问于2016-12-22得票数 1
回答已采纳
1回答
我有一个表格和一个包含rect的svg图表。
我想将鼠标悬停在表格的第一列并填充图表的第一个矩形，当您将鼠标悬停在表格的第二列上时，填充第二个矩形。
这是重复2
这就是工作原理：
$('tr td:nth-child(1)').mouseover(function(){
$('rect:nth-of-type(1)').css("fill", "black" );
});
$('tr td:nth-child(2)').mouseover(function(){
浏览 1提问于2013-01-29得票数 0
回答已采纳
2回答
svg的文本和边框就像一个元素
、、、、
我正在制作一个地图区+ svg交互式地图。当我将鼠标悬停在像EU这样的大区域上时，svg部分就会出现。但每次我将鼠标悬停在文本或边框上时，它就会消失。有人知道怎么解决这个问题吗？
CSS：
.eu {
position: absolute;
top: -80px;
left: -80px;
display: none;
width: 1200px;
height: 1200px;
z-index: 300;
}
.visible {
display: block;
pointer-events: a
浏览 0提问于2016-07-19得票数 0
2回答
我在页面上的object标签中包含了一个SVG图像文件，如下所示：
<object type="image/svg+xml" data="linkto/image.svg">
<!-- fallback image in CSS -->
</object>
有问题的图像是世界地图，我想在鼠标悬停在group上时转换fill属性，在本例中，我按大陆对我的SVG进行了分组，因此南美洲看起来如下所示：
<g id="south_america">
<path fill="#FA
浏览 1提问于2013-11-16得票数 75
回答已采纳
我正在尝试制作一个可点击的svg牙齿，并将点击的牙齿值发送到我的数据库中。怎么做/？
我试图将css添加到我的svg中，但是如果我以“..even”的类为目标，悬停就不能工作了。
.toothdiv {
background:linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%);
width: 100%;
height: 500px;
margin: auto;
}
a path:hover{
fill:red;
}
```SVG
<svg class=“牙盘”
当鼠标指针在svg路径上时，我
浏览 0提问于2019-06-08得票数 0
0回答
在下面的示例中，我希望在初始加载时永久突出显示特定的链接(每个节点之间的连接)：
正如您所看到的，它将在鼠标悬停时突出显示一个链接。
这是通过css实现的：
.link:hover {
stroke-opacity: .5;
}
如何在不使用鼠标悬停(即首次添加SVG元素时)的情况下，对特定链接(例如，前两个节点之间的链接)获得相同的结果。
浏览 0提问于2016-12-31得票数 1
回答已采纳
1回答
我在我的网站上使用Lightbox，它很棒。但是，当我将鼠标悬停在缩略图上时，光标会变成一只小手，这正是我想要的。但是当我点击一张图片，它变得很大时，光标就变成了指针。我可以改变它，当我悬停在大图上时，它仍然是一只手吗？
我在lightbox.css中找不到任何东西
浏览 2提问于2012-10-26得票数 0
回答已采纳
我正在使用jQuery动态添加一个元素来显示SVG，代码如下：
someEl = ('#someElement');
cancelButton = $(document.createElement('object')).attr({
'class': 'cancelButton',
'id':parent_id+'_xbtn',
'data': 'img/cancelBtn.svg',
浏览 0提问于2013-02-09得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
