-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathteste.html
36 lines (32 loc) · 1.07 KB
/
teste.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://unpkg.com/@popperjs/[email protected]/dist/umd/popper.min.css">
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/tippy.css">
</head>
<body>
<!-- Seu conteúdo aqui -->
<svg id="meu-svg" width="500" height="500">
<g id="botao1">
<rect x="50" y="50" width="100" height="50" fill="blue" />
<text x="75" y="80" fill="white">Botão 1</text>
</g>
<g id="botao2">
<rect x="200" y="50" width="100" height="50" fill="red" />
<text x="225" y="80" fill="white">Botão 2</text>
</g>
<!-- Adicione os outros botões aqui -->
</svg>
<script src="https://unpkg.com/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/tippy.umd.js"></script>
<script>
const svg = document.getElementById('meu-svg');
const botoes = svg.querySelectorAll('g');
botoes.forEach(botao => {
tippy(botao, {
content: `Dica de ferramenta para ${botao.id}`
});
});
</script>
</body>
</html>