English : Português

Descrição : Código : Exemplo : Ajuda : Ranque

Ponto mais próximo do retângulo, dado um ponto fora dos limites.
Criado: 2005.08.20

//+ Jonas Raoni Soares Silva
//@ http://jsfromhell.com/math/closest-square-point [rev. #1]

closestSquarePoint = function(px, py, x, y, w, h){
    return {x: px < x ? x : px > x + w ? x + w : px, y: py < y ? y : py > y + h ? y + h : py};
};

<div id="retangulo" style="position: absolute; background: #eef; width: 200px; height: 200px; left:200px; top: 200px;">Mova o mouse fora da ?rea do ret?ngulo</div>
<div id="dot" style="position: absolute; border:1px solid #000; background: #fee; width: 20px; height: 20px;"></div>

<script type="text/javascript">
//<![CDATA[

var square = document.getElementById("retangulo"), box = document.getElementById("dot");

//http://www.jsfromhell.com/geral/event-listener
addEvent(document, "mousemove", function(e){
    var p = closestSquarePoint(e.clientX, e.clientY, square.offsetLeft, square.offsetTop, square.offsetWidth, square.offsetHeight);
    box.style.left = (p.x - box.offsetWidth / 2) + "px";
    box.style.top = (p.y - box.offsetHeight / 2) + "px";
});

//]]>
</script>

closestSquarePoint( px: Integer, py: Integer, x: Integer, y: Integer, width: Integer, height: Integer ): Object

Retorna um objeto contendo duas propriedades (x e y), que especificam o ponto limítrofe de um quadrado em relação a um ponto.

px

coordenada x do ponto

py

coordenada y do ponto

x

coordenada x do ponto de origem do retângulo

y

coordenada y do ponto de origem do retângulo

width

largura do retângulo

height

altura do retângulo

0 1 2 3 4 5