Centrar círculo al hacer click (CSS + HTML + JS)

[JonaLamper]

¡Muy buenas!

Tengo que realizar un ejercicio muy simple: al hacer click en la pantalla deberá salir un círculo (que durará sólo 0,5 segundos). El círculo saldrá en las coordenadas donde se haya hecho click y el puntero deberá aparecer en el centro del círculo. El problema es que no sé cómo hacer para que aparezca en el centro, porque a mí me aparece arriba a la izquierda (toma como referencia la esquina superior izquierda de lo que es el círculo). Dejo aquí una captura y el código (es muy simple):

Código para ejecutar:

https://jsfiddle.net/tDQWN/9589/





¿Alguien podría ayudarme? Muchas gracias 

[ivancea96]

Si la posición del ratón es (X, Y), y el radio del círculo es R, entonces deberás colocarlo en la posición (X-R, Y-r).

Y por cierto, en ese código, al callback ponle function(event). Sinó, no deberías poder usar la variable "event".

[JonaLamper]

Vaya, pues me funciona. ¿Y eso por qué pasa (lo del event)? En forma general digo

[ivancea96]

"event" no existe. Tienes que ponérselo de nombre al parámetro que recibe el callback.

[JonaLamper]

Perfecto, gracias.

Una última cosa; además de eso, también me dicen que debe tener el radio que pongamos en el input. El problema es que se cambia bien el "width" y el "height", pero el "border-radius" no se cambia  

https://jsfiddle.net/tDQWN/9592/

Si le ponemos 60 (por ejemplo), cambia el tamaño pero el border-radius se queda igual.

[+ 1 Oculto(s)]

lo que pase, que no deberia cambiar lo mismo, deberia ser en relacion al tamaño
post modificado:

$("#d").css("border-radius",valor/2);

[JonaLamper]

Uf, muchas gracias. Ayer mi mente estaba muy espesa 

[+ 1 Oculto(s)]

para resolver este y problemas mucho mas dificiles te recomiendo que leas sobre geometria computacional


saludos que te vaya bien