diff --git a/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/solution.view/index.html b/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/solution.view/index.html
index 4d1e2ea93..382800435 100644
--- a/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/solution.view/index.html
+++ b/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/solution.view/index.html
@@ -16,7 +16,7 @@
 
 <body>
 
-  Click on a list item to select it.
+  Haz click en un elemento de la lista para seleccionarlo
   <br>
 
   <ul id="ul">
@@ -39,7 +39,7 @@
 
     }
 
-    // prevent unneeded selection of list elements on clicks
+    // evitando la selección innecesaria de elementos de la lista en los clics
     ul.onmousedown = function() {
       return false;
     };
diff --git a/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/source.view/index.html b/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/source.view/index.html
index e18d4a994..fb158c563 100644
--- a/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/source.view/index.html
+++ b/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/source.view/index.html
@@ -16,7 +16,7 @@
 
 <body>
 
-  Click on a list item to select it.
+  Haz click en un elemento de la lista para seleccionarlo.
   <br>
 
   <ul id="ul">
@@ -28,7 +28,7 @@
   </ul>
 
   <script>
-    // ...your code...
+    //...Tu código
   </script>
 
 </body>
diff --git a/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/task.md b/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/task.md
index 8d29134ff..1045c9c05 100644
--- a/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/task.md
+++ b/2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/task.md
@@ -1,18 +1,18 @@
-importance: 5
+importancia: 5
 
 ---
 
-# Selectable list
+# Lista seleccionable
 
-Create a list where elements are selectable, like in file-managers.
+Cree una lista donde los elementos son seleccionables, como en los administradores de archivos.
 
-- A click on a list element selects only that element (adds the class `.selected`), deselects all others.
-- If a click is made with `key:Ctrl` (`key:Cmd` for Mac), then the selection is toggled on the element, but other elements are not modified.
+- Un clic en un elemento de la lista selecciona solo ese elemento (agrega la clase `.selected`), deselecciona todos los demás.
+- Si se hace un clic con `key:Ctrl` (`key:Cmd` para Mac), el estado seleccionado/deseleccionado cambia para ese solo elemento, los otros elementos no se modifican.
 
-The demo:
+Demo:
 
 [iframe border="1" src="solution" height=180]
 
-P.S. For this task we can assume that list items are text-only. No nested tags.
+PD: Para esta tarea, podemos suponer que los elementos de la lista son solo de texto. No hay etiquetas anidadas.
 
-P.P.S. Prevent the native browser selection of the text on clicks.
+PPD: Evita la selección nativa del navegador del texto en los clics.
diff --git a/2-ui/3-event-details/1-mouse-events-basics/article.md b/2-ui/3-event-details/1-mouse-events-basics/article.md
index 551bc564a..0e3b9ca2e 100644
--- a/2-ui/3-event-details/1-mouse-events-basics/article.md
+++ b/2-ui/3-event-details/1-mouse-events-basics/article.md
@@ -1,211 +1,212 @@
-# Mouse events
+# Eventos del Mouse
 
-In this chapter we'll get into more details about mouse events and their properties.
+En este capítulo vamos a entrar en más detalles sobre los eventos del mouse y sus propiedades.
 
-Please note: such events may come not only from "mouse devices", but are also from other devices, such as phones and tablets, where they are emulated for compatibility.
+Ten en cuenta que tales eventos pueden provenir no sólo del "dispositivo mouse", sino también de otros dispositivos, como teléfonos y tabletas, donde se emulan por compatibilidad.
 
-## Mouse event types
+## Tipos de eventos del mouse
 
-We've already seen some of these events:
+Ya hemos visto algunos de estos eventos:
 
 `mousedown/mouseup`
-: Mouse button is clicked/released over an element.
+: Se oprime/suelta el botón del ratón sobre un elemento.
 
 `mouseover/mouseout`
-: Mouse pointer comes over/out from an element.
+: El puntero del mouse se mueve sobre/sale de un elemento.
 
 `mousemove`
-: Every mouse move over an element triggers that event.
+: Cualquier movimiento del mouse sobre un elemento activa el evento.
 
 `click`
-: Triggers after `mousedown` and then `mouseup` over the same element if the left mouse button was used.
+: Se activa después de `mousedown` y un `mouseup` enseguida sobre el mismo elemento si se usó el botón.
 
 `dblclick`
-: Triggers after two clicks on the same element within a short timeframe. Rarely used nowadays.
+: Se activa después de dos clicks seguidos sobre el mismo elemento. Hoy en día se usa raramente.
 
 `contextmenu`
-: Triggers when when the right mouse button is pressed. There are other ways to open a context menu, e.g. using a special keyboard key, it triggers in that case also, so it's not exactly the mouse event.
+: Se activa al pulsar el botón derecho del ratón. Existen otras formas de abrir el menú contextual, por ejemplo: usando un comando especial de teclado también puede activarse, de manera que no es exactamente un evento exclusivo del mouse.
 
-...There are several other events too, we'll cover them later.
+...Existen otros eventos más que cubriremos más tarde.
 
-## Events order
+## El orden de los eventos
 
-As you can see from the list above, a user action may trigger multiple events.
+Como pudiste ver en la lista anterior, una acción del usuario puede desencadenar varios eventos.
 
-For instance, a left-button click first triggers `mousedown`, when the button is pressed, then `mouseup` and `click` when it's released.
+Por ejemlo , un click izquierdo primero activa `mousedown`cuando se presiona el botón, enseguida `mouseup` y `click` cuando se suelta.
 
-In cases when a single action initiates multiple events, their order is fixed. That is, the handlers are called in the order `mousedown` -> `mouseup` -> `click`. 
+En casos así, el orden es fijo. Es decir, los controladores son llamados en el siguiente orden `mousedown` -> `mouseup` -> `click`. 
 
 ```online
-Click the button below and you'll see the events. Try double-click too.
+Haz click en el botón abajo y verás los eventos. Intenta con doble click también.
 
-On the teststand below all mouse events are logged, and if there is more than a 1 second delay between them they are separated by a horizontal ruler.
+En el testeador de abajo todos los eventos quedan registrados. Si hay mas de un segundo de retraso entre cada uno de ellos quedan separados por una regla horizontal.
 
-Also we can see the `button` property that allows to detect the mouse button, it's explained below.
+Además podemos ver la propiedad de `button` que nos permite detectar el botón del mouse. Lo explicaremos a continuación.
 
-<input onmousedown="return logMouse(event)" onmouseup="return logMouse(event)" onclick="return logMouse(event)" oncontextmenu="return logMouse(event)" ondblclick="return logMouse(event)" value="Click me with the right or the left mouse button" type="button"> <input onclick="logClear('test')" value="Clear" type="button"> <form id="testform" name="testform"> <textarea style="font-size:12px;height:150px;width:360px;"></textarea></form>
+<input onmousedown="return logMouse(event)" onmouseup="return logMouse(event)" onclick="return logMouse(event)" oncontextmenu="return logMouse(event)" ondblclick="return logMouse(event)" value="Haz click sobre mí con el botón izquierdo o derecho del mouse" type="button"> <input onclick="logClear('test')" value="Clear" type="button"> <form id="testform" name="testform"> <textarea style="font-size:12px;height:150px;width:360px;"></textarea></form>
 ```
 
-## Mouse button
+## El botón del mouse
 
-Click-related events always have the `button` property, which allows to get the exact mouse button.
+Los eventos relacionados con clics siempre tienen la propiedad `button`, esta nos permite conocer el botón exacto del mouse.
 
-We usually don't use it for `click` and `contextmenu` events, because the former happens only on left-click, and the latter -- only on right-click. 
+Normalmente no la usamos para eventos `click` y `contextmenu` events, porque sabemos que ocurren solo con click izquierdo y derecho respectivamente. 
 
-From the other hand, `mousedown` and `mouseup` handlers we may need `event.button`, because these events trigger on any button, so `button` allows to distinguish between "right-mousedown" and "left-mousedown".
+Por otro lado, con lo controloadores `mousedown` y `mouseup` vamos a necesitar `event.button` ya que estos eventos se activan con cualquier botón, por lo que `button` nos permitira distinguir entre "mousedown derecho" y "mousedown izquierdo".
 
-The possible values of `event.button` are:
+Los valores posibles para `event.button` son:
 
-| Button state | `event.button` |
+| Estado del botón | `event.button` |
 |--------------|----------------|
-| Left button (primary) | 0 |
-| Middle button (auxillary) | 1 |
-| Right button (secondary) | 2 |
-| X1 button (back) | 3 |
-| X2 button (forward) | 4 |
+| Botón izquierdo (primario) | 0 |
+| Botón central (auxiliar) | 1 |
+| Botón derecho (secundario) | 2 |
+| Botón X1 (atrás) | 3 |
+| Botón X2 (adelante) | 4 |
 
-Most mouse devices only have the left and right buttons, so possible values are `0` or `2`. Touch devices also generate similar events when one taps on them.
+La mayoría de los dispositivos de ratón sólo tienen los botones izquierdo y derecho, por lo que los valores posibles son `0` o `2`. Los dispositivos táctiles también generan eventos similares cuando se toca sobre ellos.
 
-Also there's `event.buttons` property that has all currently pressed buttons as an integer, one bit per button. In practice this property is very rarely used, you can find details at [MDN](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons) if you ever need it.
+También hay una propiedad `event.buttons` que guarda todos los botones presionados actuales en un solo entero, un bit por botón. En la práctica, esta propiedad es raramente utilizada. Puedes encontrar más detalles en [MDN](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons) si alguna vez lo necesitas.
 
-```warn header="The outdated `event.which`"
-Old code may use `event.which` property that's an old non-standard way of getting a button, with possible values:
+```warn header="El obsoleto `event.which`"
+El código puede utilizar la propiedad `event.which` que es una forma antigua no estándar de obtener un botón con los valores posibles:
 
-- `event.which == 1` – left button,
-- `event.which == 2` – middle button,
-- `event.which == 3` – right button.
+- `event.which == 1` – botón izquierdo,
+- `event.which == 2` – botón central,
+- `event.which == 3` – botón derecho.
 
-As of now, `event.which` is deprecated, we shouldn't use it.
+Ahora `event.which` está en desuso, no deberíamos usarlo.
 ```
 
-## Modifiers: shift, alt, ctrl and meta
+## Modificadores: shift, alt, ctrl y meta
 
-All mouse events include the information about pressed modifier keys.
+Todos los eventos del mouse incluyen la información sobre las teclas modificadoras presionadas.
 
-Event properties:
+Propiedades del evento:
 
 - `shiftKey`: `key:Shift`
-- `altKey`: `key:Alt` (or `key:Opt` for Mac)
+- `altKey`: `key:Alt` (p `key:Opt` para Mac)
 - `ctrlKey`: `key:Ctrl`
-- `metaKey`: `key:Cmd` for Mac
+- `metaKey`: `key:Cmd` para Mac
 
-They are `true` if the corresponding key was pressed during the event.
+Su valor es `true` si la tecla fue presionada durante el evento.
 
-For instance, the button below only works on `key:Alt+Shift`+click:
+Por ejemplo, el botón abajo solo funciona con`key:Alt+Shift`+click:
 
 ```html autorun height=60
-<button id="button">Alt+Shift+Click on me!</button>
+<button id="button">Alt+Shift+¡Click sobre mí!</button>
 
 <script>
   button.onclick = function(event) {
 *!*
     if (event.altKey && event.shiftKey) {
 */!*
-      alert('Hooray!');
+      alert('¡Genial!');
     }
   };
 </script>
 ```
 
-```warn header="Attention: on Mac it's usually `Cmd` instead of `Ctrl`"
-On Windows and Linux there are modifier keys `key:Alt`, `key:Shift` and `key:Ctrl`. On Mac there's one more: `key:Cmd`, corresponding to the property `metaKey`.
+```warn header="Atención: en Mac suele ser `Cmd` en lugar de `Ctrl`"
+En Windows y Linux existen las teclas modificadoras `key:Alt`, `key:Shift` y `key:Ctrl`. En Mac hay una más: `key:Cmd`, correspondiente a la propiedad `metaKey`.
 
-In most applications, when Windows/Linux uses `key:Ctrl`, on Mac `key:Cmd` is used.
+En la mayoría de las aplicaciones, cuando Windows/Linux usan `key:Ctrl`, en Mac se usa `key:Cmd`.
 
-That is: where a Windows user presses `key:Ctrl+Enter` or `key:Ctrl+A`, a Mac user would press `key:Cmd+Enter` or `key:Cmd+A`, and so on.
+Es decir: cuando un usuario de Windows usa `key:Ctrl+Enter` o `key:Ctrl+A`, un usuario Mac presionaría `key:Cmd+Enter` o `key:Cmd+A`, y así sucesivamente.
 
-So if we want to support combinations like `key:Ctrl`+click, then for Mac it makes sense to use `key:Cmd`+click. That's more comfortable for Mac users.
+Entonces si queremos darle soporte a combinaciones como `key:Ctrl`+click, entonces para Mac tendría más sentido usar `key:Cmd`+click. Esto es más cómodo para los usuarios de Mac.
 
-Even if we'd like to force Mac users to `key:Ctrl`+click -- that's kind of difficult. The problem is: a left-click with `key:Ctrl` is interpreted as a *right-click* on MacOS, and it generates the `contextmenu` event, not `click` like Windows/Linux.
+Incluso si quisieramos obligar a los usuarios de Mac a hacer `key:Ctrl`+click -- esto supone algo de dificultad. El problema es que: un click izquierdo con `key:Ctrl` es intrepetado como  *click derecho* en MacOS, y esto genera un evento `contextmenu`, no un `click` como en Windows/Linux.
 
-So if we want users of all operating systems to feel comfortable, then together with `ctrlKey` we should check `metaKey`.
+Así que si queremos que los usuarios de todos los sistemas operativos se sientan cómodos, entonces junto con `ctrlKey` debemos verificar `metaKey`.
 
-For JS-code it means that we should check `if (event.ctrlKey || event.metaKey)`.
+Para código JS  significa que debemos hacer la comprobación `if (event.ctrlKey || event.metaKey)`.
 ```
 
-```warn header="There are also mobile devices"
-Keyboard combinations are good as an addition to the workflow. So that if the visitor uses a keyboard -- they work. 
+```warn header="También hay dispositivos móviles"
+Las combinaciones de teclado son buenas como una adición al flujo de trabajo. De modo que si el visitante usa un teclado -- funcionan. 
+
+Pero si su dispositivo no lo tiene -- entonces debería haber una manera de vivir sin teclas modificadoras.
 
-But if their device doesn't have it -- then there should be a way to live without modifier keys.
 ```
 
-## Coordinates: clientX/Y, pageX/Y
+## Coordenadas: clientX/Y, pageX/Y
 
-All mouse events provide coordinates in two flavours:
+Todos los eventos del ratón proporcionan coordenadas en dos sabores:
 
-1. Window-relative: `clientX` and `clientY`.
-2. Document-relative: `pageX` and `pageY`.
+1. Relativas a la ventana: `clientX` y `clientY`.
+2. Relativos al documento: `pageX` y `pageY`.
 
-We already covered the difference between them in the chapter <info:coordinates>.
+Ya cubrimos la diferencia entre ellos en el capítulo <info:coordinates>.
 
-In short, document-relative coordinates `pageX/Y` are counted from the left-upper corner of the document, and do not change when the page is scrolled, while `clientX/Y` are counted from the current window left-upper corner. When the page is scrolled, they change.
+En resumen, las coordenadas relativas al documento `pageX/Y`se cuentan desde la esquina superior izquierda del documento y no cambian cuando se desplaza la página, mientras que `clientX/Y` se cuentan desde la esquina superior actual. Cambian cuando se desplaza la página.
 
-For instance, if we have a window of the size 500x500, and the mouse is in the left-upper corner, then `clientX` and `clientY` are `0`, no matter how the page is scrolled. 
+Por ejemplo, si tenemos una ventana del tamaño 500x500, y el mouse está en la esquina superior izquierda, entonces `clientX` y `clientY` son `0`, sin importar cómo se desplace la página. 
 
-And if the mouse is in the center, then `clientX` and `clientY` are `250`, no matter what place in the document it is. They are similar to `position:fixed` in that aspect.
+Y si el mouse está en el centro, entonces `clientX` y `clientY` son `250`, No importa en qué parte del documento se encuentren. Esto es similar a `position:fixed` en ese aspecto.
 
 ````online
-Move the mouse over the input field to see `clientX/clientY` (the example is in the `iframe`, so coordinates are relative to that `iframe`):
+Mueve el mouse sobre el campo de entrada para ver `clientX/clientY` (el ejemplo está dentro del `iframe`, así que las coordenadas son relativas al `iframe`):
 
 ```html autorun height=50
-<input onmousemove="this.value=event.clientX+':'+event.clientY" value="Mouse over me">
+<input onmousemove="this.value=event.clientX+':'+event.clientY" value="Pasa el mouse sobre mí">
 ```
 ````
 
-## Preventing selection on mousedown
+## Previniendo la selección en mousedown
 
-Double mouse click has a side-effect that may be disturbing in some interfaces: it selects text.
+El doble clic del mouse tiene un efecto secundario que puede ser molesto en algunas interfaces: selecciona texto.
 
-For instance, a double-click on the text below selects it in addition to our handler:
+Por ejemplo, un doble clic en el texto de abajo lo selecciona además de activar nuestro controlador:
 
 ```html autorun height=50
-<span ondblclick="alert('dblclick')">Double-click me</span>
+<span ondblclick="alert('dblclick')">Haz doble click en mi</span>
 ```
 
-If one presses the left mouse button and, without releasing it, moves the mouse, that also makes the selection, often unwanted.
+Si se pulsa el botón izquierdo del ratón y, sin soltarlo, mueve el ratón, también hace la selección, a menudo no deseado.
 
-There are multiple ways to prevent the selection, that you can read in the chapter <info:selection-range>.
+Hay varias maneras de evitar la selección, que se pueden leer en el capítulo <info:selection-range>.
 
-In this particular case the most reasonable way is to prevent the browser action on `mousedown`. It prevents both these selections:
+En este caso particular, la forma más razonable es evitar la acción del navegador `mousedown`. Esto evita ambas selecciones:
 
 ```html autorun height=50
-Before...
+Antes...
 <b ondblclick="alert('Click!')" *!*onmousedown="return false"*/!*>
-  Double-click me
+  Haz doble click en mí
 </b>
-...After
+...Después
 ```
 
-Now the bold element is not selected on double clicks, and pressing the left button on it won't start the selection.
+Ahora el elemento en negrita no se selecciona con doble clic, y al mantener presionado el botón izquierdo y arrastrar no se iniciará la selección.
 
-Please note: the text inside it is still selectable. However, the selection should start not on the text itself, but before or after it. Usually that's fine for users.
+Tenga en cuenta: el texto dentro de él todavía es seleccionable. Sin embargo, la selección no debe comenzar en el texto en sí, sino antes o después. Por lo general, eso está bien para los usuarios.
 
-````smart header="Preventing copying"
-If we want to disable selection to protect our page content from copy-pasting, then we can use another event: `oncopy`.
+````smart header="Previniendo copias"
+Si queremos inhabilitar la selección para proteger nuestro contenido de la página del copy-paste, entonces podemos utilizar otro evento: `oncopy`.
 
 ```html autorun height=80 no-beautify
-<div *!*oncopy="alert('Copying forbidden!');return false"*/!*>
-  Dear user,
-  The copying is forbidden for you.
-  If you know JS or HTML, then you can get everything from the page source though.
+<div *!*oncopy="alert('¡Copiado prohibido!');return false"*/!*>
+  Querido usuario,
+  El copiado está prohibida para ti.
+  Si sabes JS o HTML entonces puedes obtener todo de la fuente de la página.
 </div>
 ```
-If you try to copy a piece of text in the `<div>`, that won't work, because the default action `oncopy` is prevented.
+Si intenta copiar un fragmento de texto en el `<div>` no va a funcionar porque la acción default de `oncopy` fue evitada.
 
-Surely the user has access to HTML-source of the page, and can take the content from there, but not everyone knows how to do it.
+Seguramente el usuario tiene acceso a la fuente HTML de la página, y puede tomar el contenido desde allí, pero no todos saben cómo hacerlo.
 ````
 
-## Summary
+## Resumen
 
-Mouse events have the following properties:
+Los eventos del mouse tienen las siguientes propiedades:
 
-- Button: `button`.
-- Modifier keys (`true` if pressed): `altKey`, `ctrlKey`, `shiftKey` and `metaKey` (Mac).
-  - If you want to handle `key:Ctrl`, then don't forget Mac users, they usually use `key:Cmd`, so it's better to check `if (e.metaKey || e.ctrlKey)`.
+- Botón: `button`.
+- Teclas modificadoras (`true` si fueron presionadas): `altKey`, `ctrlKey`, `shiftKey` y `metaKey` (Mac).
+  - Si quieres controlar las acciones de la tecla `key:Ctrl` no te olvides de los usuarios de Mac que generalmente usan `key:Cmd`, de manera que es mejor ferificar con la condicional: `if (e.metaKey || e.ctrlKey)`.
 
-- Window-relative coordinates: `clientX/clientY`.
-- Document-relative coordinates: `pageX/pageY`.
+- Coordenadas relativas a la ventana: `clientX/clientY`.
+- Coordenadas relativas al documento: `pageX/pageY`.
 
-The default browser action of `mousedown` is text selection, if it's not good for the interface, then it should be prevented.
+La acción predeterminada del navegador `mousedown` es la selección del texto, si no es bueno para la interfaz, entonces debe evitarse.
 
-In the next chapter we'll see more details about events that follow pointer movement and how to track element changes under it.
+En el próximo capítulo veremos más detalles sobre los eventos que siguen al movimiento del puntero y cómo rastrear los cambios de elementos debajo de él.
