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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
|
---
title: Document.elementFromPoint()
slug: Web/API/Document/elementFromPoint
tags:
- API
- CSSOM View
- Method
- NeedsMarkupWork
- NeedsMobileBrowserCompatibility
- Reference
translation_of: Web/API/DocumentOrShadowRoot/elementFromPoint
translation_of_original: Web/API/Document/elementFromPoint
---
<div>{{APIRef("DOM")}}</div>
<p>O método <code><strong>elementFromPoint()</strong></code> da interface {{domxref("Document")}} retorna o elemento de maior nível nas coordenadas especificadas.</p>
<p>Se o elemento no ponto especificado pertencer à outro documento (por exemplo, um subdocumento em um iframe), será retornado o pai do subdocumento (o próprio iframe). Se o elemento em determinado ponto for anônimo ou for um conteudo gerado por XBL, como por exemplo barras de scroll de caixas de texto, então será retornado o primeiro elemento pai, não-anônimo (por exemplo, a própria caixa de texto).</p>
<p>Se o ponto especificado estiver fora dos limites visíveis do documento ou tiver uma coordenada negativa, o resultado é <code>null</code>.</p>
<p>Se você precisa encontrar uma posição específica dentro do elemento, use {{domxref("Document.caretPositionFromPoint()")}}.</p>
<p>{{Note("Chamados por documentos XUL devem esperar até o evento <code>onload</code> ser acionado antes de chamar este método.")}}</p>
<h2 id="Syntax" name="Syntax">Sintaxe</h2>
<pre class="syntaxbox">var element = document.elementFromPoint(x, y);</pre>
<h3 id="Parâmetros">Parâmetros</h3>
<dl>
<dt>x</dt>
<dd>Uma posição horizontal dentro do viewport atual.</dd>
<dt>y</dt>
<dd>Uma position vertical dentro do viewport atual.</dd>
</dl>
<h3 id="Valor_retornado">Valor retornado</h3>
<p>O objeto de nível mais alto {{domxref("Element")}} dentro das coordenadas declaradas.</p>
<h2 id="Example" name="Example">Exemplo</h2>
<pre class="brush:html"><!DOCTYPE html>
<html lang="en">
<head>
<title>exemplo de elementFromPoint</title>
<script>
function changeColor(newColor) {
elem = document.elementFromPoint(2, 2);
elem.style.color = newColor;
}
</script>
</head>
<body>
<p id="para1">Algum texto aqui</p>
<button onclick="changeColor('blue');">azul</button>
<button onclick="changeColor('red');">vermelho</button>
</body>
</html>
</pre>
<h2 id="Especificações">Especificações</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Especificação</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('CSSOM View', '#dom-document-elementfrompoint', 'elementFromPoint')}}</td>
<td>{{Spec2('CSSOM View')}}</td>
<td>Definição Inicial.</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilidade_entre_navegadores">Compatibilidade entre navegadores</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Funcionalidade</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td> {{CompatChrome(4.0)}}</td>
<td>3</td>
<td>5.5</td>
<td>10.50</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Funcionalidade</th>
<th>Android</th>
<th>Chrome para Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
</tbody>
</table>
</div>
|
