html - SVG路径中的工具提示在纯html中工作时不起作用

Question

我有这个非常简单的 CSS/HTML 代码，它可以在纯 HTML 上工作，并且在演示结束时也作为示例显示。但是，它无法在 SVG 中工作。

检查元素时，:after会调用代码但看不到工具提示。知道我哪里错了吗？

JSFiddle 演示

    .land
    {
    	fill: rgba(255,210,0,0.6);
    	stroke:white;
    	stroke-opacity: 1;
    	stroke-width:0.5;
    }
   	.land:hover{
        fill:rgb(255,210,0);
   	}
    .byrne {
        display: inline;
        position: relative;
    }
    .byrne:hover:after{
        background: #333;
        background: rgba(0,0,0,.8);
        border-radius: 5px;
        bottom: 26px;
        color: #fff;
        content: attr(title);
        left: 20%;
        padding: 5px 15px;
        position: absolute;
        z-index: 98;
        width: 220px;
    }

      <svg xmlns="http://www.w3.org/2000/svg" xmlns:amcharts="http://amcharts.com/ammap" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="-90 280 1040 870">
    	<defs>
    		
    		<amcharts:ammap projection="mercator" leftlongitude="68.183544" toplatitude="37.053723" rightlongitude="97.419080" bottomlatitude="6.751085"></amcharts:ammap>
    
    		<!-- All areas are listed in the line below. You can use this list in your script. -->
    		<!--{id:"IN-AN"},{id:"IN-AP"},{id:"IN-AR"},{id:"IN-AS"},{id:"IN-BR"},{id:"IN-CH"},{id:"IN-CT"},{id:"IN-DD"},{id:"IN-DL"},{id:"IN-DN"},{id:"IN-GA"},{id:"IN-GJ"},{id:"IN-HP"},{id:"IN-HR"},{id:"IN-JH"},{id:"IN-JK"},{id:"IN-KA"},{id:"IN-KL"},{id:"IN-LD"},{id:"IN-MH"},{id:"IN-ML"},{id:"IN-MN"},{id:"IN-MP"},{id:"IN-MZ"},{id:"IN-NL"},{id:"IN-OR"},{id:"IN-PB"},{id:"IN-PY"},{id:"IN-RJ"},{id:"IN-SK"},{id:"IN-TG"},{id:"IN-TN"},{id:"IN-TR"},{id:"IN-UP"},{id:"IN-UT"},{id:"IN-WB"}-->
    
    	</defs>
    	<g>
    	    <a title="This is some information for our tooltip." class="byrne">
    		<path id="Andhra Pradesh - 37 units" title="Andhra Pradesh" class="land" stroke="#FFFFFF" stroke-width="0.5" d="M374.37,881.072l-0.003,0.009l0,0L374.37,881.072z M375.185,881.023
    			l-0.485,3.09l-0.941-1.338l-0.021-0.997L375.185,881.023z M374.37,881.072l-0.152-0.778l-0.34,0.55l-1.578,0.121l-0.072-0.907
    			l-1.126,0.721l2.171,0.952l0,0l-0.028,1.288l0.567,0.174l0.828,1.861l-9.559,4.679l-5.865,2.304l-4.694-1.326l-3.882,0.459
    			l-3.336,1.656l-3.249,7.113l0.124,1.203l-3.635,3.846l-0.342,0.577l0.48,1.08l-1.186,1.037l-3.787,0.51l-1.083-1.825l0.327-0.966
    			l0.466,0.007l-0.146-0.72l-3.103-1.083l-3.91,0.753l-2.784,1.329l-2.392,1.574l-1.824,2.035l-1.81,5.579l-2.653,4.202
    			l-1.344,6.258l1.744,9.312l2.203,3.861l-1.811,12.51l3.009,8.091l-0.217,4.812l2.063,5.512l-3.772-6.844l-0.705-0.319l-0.146,2.37
    			l-0.771-0.772l0.443-0.765l-0.501-0.097l-1.462,2.297l2.895,2.636l1.961,0.045l1.977,1.75l0,0l0.001,1.418l-0.945-0.527
    			l-1.194-2.346l-2.048-0.054l-2.162-1.571l-1.972,0.214l-0.104,0.522l1.113,0.222l0.087,0.464l-0.789-0.088l-0.275,0.756
    			l-0.877,0.219l0.036,0.893l-0.805,0.362l0.551,0.808l-0.733,1.02l-1.945,0.868l-1.331-0.023l-0.536,0.595l-0.673-0.554
    			l-0.858,0.816l1.665,1.303l-1.061,0.763l-0.563-0.719l-0.893,0.386l0.191-0.707l-0.595,0.118l-0.125-1.401l-2.311,0.977
    			l-0.825-0.581l-0.339-1.174l-2.797-0.335l-1.42,0.549l1.319,0.58l-0.371,1.849l0.661-0.473l0.247,0.349l-0.625,0.22l0.056,0.562
    			l-1.989,0.651l0.178,0.889l-1.22,0.877l-1.061-1.183l-1.284,0.151l-0.001,0.845l-0.769,0.515l-0.948,2.064l-2.188-0.183
    			l-2.341-1.664l-1.707,0.233l-0.547,0.872l0.816,0.439l-1.119-0.028l-0.154-1.774l-3.403,1.089l-1.14-0.286l-0.228,1.381
    			l-1.116-0.36l-0.98,1.041l0.864,1.596l-0.549-0.005l-1.145,3.958l-0.953,0.716l0.055,1.555l-0.609,0.158l-0.22-0.637l0,0l0,0l0,0
    			l-0.142,0.046l-0.448-0.045l-0.127,1.07l-0.809,0.027l0.051,1.195l-2.389,0.148l-2.037-1.095l-0.682-1.037l-1.951,0.281
    			l0.978-0.903l-0.171-0.997l0,0l0.535-2.527l1.623,0.006l1.107-2.158l0.861,0.877l1.504-0.146l-0.344-1.812l0.922,0.143
    			l-0.167-1.821l1.388-0.566l-0.07-0.771l0.681-0.419l-0.502-0.595l1.579-0.985l-0.736-0.82l0.727-0.453l0.23-1.544l-0.571-0.999
    			l-0.912,1.172l-1.284-1.397l-0.936,0.255l-0.301-0.554l-0.869,0.411l-0.635-0.438l0.795-0.329l-1.105-0.607l0.933-5.962
    			l-4.268-0.243l-1.162,0.824l0.28-1.599l-0.875-0.194l-0.125-0.676l-1.962,0.357l-0.586-0.848l0.15-0.567l1.082,0.102l0.105-0.691
    			l-0.64-0.623l0.872-1.163l-0.123-1.712l-1.895-1.228l-0.088,0.908l-1.377-0.235l-0.507,1.111l-0.555,0.006l-0.055-1.614
    			l0.931-0.352l-0.304-1.532l-1.435,1.429l-0.644-0.91l-1.797-0.099l-0.312,0.703l0.559,1.286l-1.353,0.661l0.063,0.617
    			l-1.717,0.599l-0.108,1.545l-0.345-0.768l-0.833,0.245l0.17-0.677l-0.552,0.045l-1.011,0.547l0.688,0.541l-0.405,0.21
    			l-0.671-0.434l-1.035,0.726l-0.953-0.733l-0.192,1.558l-0.653-0.565l-0.115,0.726l-0.869,0.104l0.201-3.246l-1.276-0.059
    			l0.415-0.961l-1.703-0.283l-1.032,0.534l-0.343-0.844l-1.478,0.477l-0.435-1.485l-0.583,0.897l-0.172-0.528l-0.684,0.571
    			l-0.046-1.543l-0.551,0.472l0.171,1.147l-1.011,0.203l1.004,0.768l0.114,1.768l-1.866-0.166l-0.921,0.59l-0.882-0.872
    			l-0.391,1.036l-0.494-0.263l-0.632-1.923l1.279-2.114l0.627-0.109l-0.143-0.755l-2.741-2.603l1.149-1.14l-1.256-1.661
    			l-1.134-0.103l0.203-0.75l1.192-0.186l0.123-0.627l2.046,0.443l-0.301,2.001l0.402,1.203l2.549,0.297l0.686,1.355l4.348-0.89
    			l1.054,1.137l-0.143,2.299l1.102-0.029l0.037,0.478l0.93-0.787l-0.516-0.72l0.6-0.875l-1.438-0.01l0.203-1.023l-1.497-0.418
    			l1.812-2.159l-0.15-0.404l-1.183,0.604l0.084-0.759l0.757-0.14l0.34-0.958l2.896,0.384l-0.109-3.24l-1.087-0.011l-0.324-1.009
    			l-1.484-0.406l-0.278,0.798l1.065,2.233l-0.835,0.54l-0.742-1.025l0.101-1.054l-2.083-0.183l0.041-1.478l-1.288,0.539
    			l-2.087-0.716l-1.052,1.349l-0.179,1.992l-0.779,0.105l-0.673-0.811l-2.925-0.015l-0.339-0.86l0.66-0.586l-1.857-1.406
    			l0.105-1.177l0.784-0.625l0.745,0.377l0.058-1.224l0.775-0.892l-2.7,0.264l-1.116-1.468l-0.729-0.125l-1.035-1.996l0.991-3.564
    			l-0.464-1.201l1.79-0.665l0.411-4.306l-0.956,0.351l-1.678-0.508l0.544-1.259l-0.27-1.474l0.594-0.522l2.087,1.673l2.75,0.493
    			l0.494-0.518l1.209,0.01l-0.154,0.641l0.99,0.146l1.967-3.246l-0.574-0.598l0.67-0.169l0.013-1.209l-0.975-0.738l1.132-1.021
    			l-0.425-0.716l-0.85-0.112l-0.15-1.011l-1.259,0.146l-0.894-3.057l-1.491-1.503l0.04-0.417l1.431,0.172l0.07-3.612l1.365-0.515
    			l0.91,0.75l0.23-0.916l-2.139-2.037l0.542-2.396l-1.089-0.233l1.144-1.826l2.028-1.118l2.76-0.464l6.817,0.999l0,0l2.537,0.246
    			l1.376,0.953l1.496-0.272l2.174,0.574l2.316-0.827l2.987,0.993l0.9-1.159l0.716,1.555l1.202,0.47l0.425-0.588l1.016-0.002
    			l0.401-1.391l1.516-0.774l0.489-2.765l1.559,0.059l2.341-1.402l4.015,0.665l1.515-1.151l2.529,1.955l1.606,0.081l1.609-1.726
    			l0.035-1.878l0.656,0.099l0.255,1.162l0.99,0.134l-0.131-2.076l0.525-0.552l2.759-1.176l3.811,0.775l1.102-0.608l0.172-7.28
    			l1.067-1.445l4.199-0.569l1.847-1.303l3.948-0.856l3.318-1.834l0.925,1.062l1.351-0.21l1.052,1.64l1.468-0.114l2.349-2.799
    			l0.57-1.859l-0.958-1.056l-1.083-0.293l0.469-1.196l0.95-1.578l2.302-0.545l1.263-1.622l0.5,0.865l1.594,0.069l1.025,1.487
    			l0.467,2.309l1.031,0.437l0.375,1.191l0.7-1.051l1.384,0.936l0.1,0.688l2.785,0.737l1.08-0.677l-1.296-1.006l0.272-1.202
    			l0.57-0.133l-0.068-1.43l-2.43-0.591l-0.091,0.837l-3.391-1.446l0.798-1.18l-0.568-1.156l0.734-0.571l0.666,1.434l0.673,0.212
    			l0.941-0.904l0.363-1.567l1.677-0.82l2.524,1.368l-0.446,0.888l2.254-0.257l2.793,1.059l0.689-0.686l0.301-2.598l1.125,0.011
    			l-0.209-1.505l2.247,0.587l1.446-0.929l3.043-0.51l0.491-2.442l2.24,0.062l1.505-1.924l1.232,0.911l1.146-0.121l2.034-2.377
    			l0.209-2.47l0.583-0.827l-0.544-0.549l1.785-2.675l0.143-1.044l5.384-2.892l0.272-0.562l-0.903-1.116l0,0l1.119-1.169l3.943-1.531
    			l1.908-1.799l3.55,0.392l0.446,0.903l1.683,0.844l0.669-0.182l-0.008-1.693l0.81-0.375l0.2,0.662l0.635-0.073l0.094-2.79
    			l0.634,0.475l0.199-0.399l-1.545-1.532l0.698-0.55l0.106-1.382l0.915-0.216l0.554-0.887l-1.533-0.292l1.309-1.424l-0.606-1.119
    			l2.95-3.48l0.657,0.963l0.628-0.06l0.184,1.909l0.617-0.092l-0.486,1.319l1.71,0.571l0.282,0.608l-0.911,1.086l0.113,1.007
    			l1.207,1.132l0.835-1.585l2.833-1.22l0.686-1.749l-0.446-0.679l0.601-0.54l1.197,0.812l1.039-0.081l0.188,1.257l1.067,0.426
    			l2.211-0.908l0.949,0.251l0.127-1.474l-0.545,0.278l-0.577-0.699l1.935-2.565l-1.487-0.273l-0.146-0.549l0.709-0.509l-1.202-0.054
    			l0.093-1.389l1.031-0.415l2.145-3.249l1.799,0.83l0.088,0.724l0.375-1.371l1.222,0.241l0.352-0.896l2.008-0.288l0.068-0.876
    			l0.979,0.035l0.393-0.788l-1.692-1.855l0.879,0.099l-0.902-0.929l-0.438,1.104l-0.62-2.001l1.073-0.556l1.637,0.378l1.221,1.39
    			l-0.183-1.484l0.683-0.02l0.088-0.574l-0.486-1.334l0.362-0.223l0.534,0.679l0.308-0.321l0.216,1.101l-0.526-0.056l0.049,0.433
    			l0.94,0.156l0.394-1.884l0.846,0.661l0.672-1.056l-0.266-0.886l0.759-0.916l1.931,3.775l0.685,0.127l-0.456,0.734l1.048,1.844
    			l0.896,0.286l-1.06-1.944l1.242-0.823l2.175,5.223l1.821,0.6l2.284-0.153l1.433,1.58l1.077-0.098l0.743-0.756l4.733-0.445
    			l0.099-2.055l0.689,0.432l0.239-0.443l-0.526-0.44l0.947,0.151l-0.585-0.51l0.852,0.278l0.826-0.757l-0.361-0.671l0.655-0.793
    			l-0.668-1.292l1.48,0.899l0.465-1.093l2.006-1.214l0.564,1.433l0.654-1.151l1.094,0.07l-0.008-0.792l-0.9,0.125l-0.732-1.304
    			l1.814,0.056l0.101-0.96l0.97,0.153l-0.216,0.87l0.658,0.651l0,0l1.098,0.675l-4.66,5.365l-0.755,2.299l-2.305,2.181l-2.871,4.294
    			l-6.031,5.628l-0.029,1.157l-10.604,5.354l-3.838,2.615l-1.126,1.884l-3.125,2.886v0.912l-1.717,2.327l-3.43,3.664l-15.853,8.033
    			l-6.259,4.833l-1.853,2.335l-0.676,2.5l-0.597,0.286l0.188,1.192l1.454,1.261l1.112-0.309l-0.297,3.087L374.37,881.072z"></path>
    	</a>
    	</g>
    </svg>
    <a title="This is some information for our tooltip." class="byrne">Hello Tooltip</a>

标签： htmlcsssvg

Answer 1

您是否尝试添加xlink:？它适用于xlink:

https://jsfiddle.net/mohzjnf6/

锚标签需要一个xlink:前缀，因为SVGs 是一种XML基于语言（不是基于HTML普遍认为的）。