Я хочу отображать всплывающее окно с текстом при наведении курсора на оранжевый текст, но я борюсь с двумя различными ситуациями с кодом, который я написал:
1) Всплывающие окна уже отображаются, когда Вы попали на страницу. Если я попытаюсь display: none в классе «всплывающее», они никогда не будут отображаться.
2) Я хочу, чтобы они относились к слову, а не ко всему абзацу, но я не знаю, как это сделать sh position: relative для класса «выбирать», так как это тег span, и, похоже, это не разрешено.
function showPopupAmplitud() {
const popup = document.getElementById('popup_amplitud');
popup.style.display = "";
}
function hidePopupAmplitud() {
const popup = document.getElementById('popup_amplitud');
popup.style.display = "none";
}
function showPopupDAW() {
const popup = document.getElementById('popup_daw');
popup.style.display = "";
}
function hidePopupDAW() {
const popup = document.getElementById('popup_daw');
popup.style.display = "none";
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
.text {
margin-left: 20%;
margin-right: 42%;
text-align: justify;
}
.popup_container {
position: relative;
}
.choose {
color: #FFAC3E;
font-weight: bold;
}
.popup {
padding: 0px 15px 25px 15px;
background-color: white;
box-shadow: 1.5px 1.5px 25px rgba(0, 0, 0, 0.3);
color: #6A6A6A;
position: absolute;
width: 50%;
top: 30px;
font-size: 16px;
line-height: 22.7px;
}
.popup p {
margin-left: 4%;
margin-right: 4%;
padding-top: 20px;
}
<div class="text">
<article>
<div class="popup_container">
Nuestro objetivo es que la <span class="choose" onmouseover="showPopupAmplitud()" onmouseout="hidePopupAmplitud()">amplitud</span> de la señal proporcionada por el sintetizador disminuya algunos decibeles cada vez que suene el redoblante. Lo que
hacemos es asignar un compresor al canal del sintetizador, y mediante el routeo entre ambos canales, activar la opción de Sidechain que tal compresor nos proporciona (no todos los compresores poseen la alternativa de ser utilizados como Sidechain).</br>
</br>
<div class="popup" id="popup_amplitud">
<p>La amplitud de un movimiento oscilatorio, ondulatorio o señal electromagnética es una medida de la variación máxima del desplazamiento u otra magnitud física que varía periódica o cuasiperiódicamente en el tiempo. Es la distancia entre el punto
más alejado de una onda y el punto de equilibrio o medio.</p>
</div>
</div>
<div class="popup_container">
En la seccion Mixer del <span class="choose" onmouseover="showPopupDAW()" onmouseout="hidePopupDAW()">DAW</span> a utilizar, se deberá routear el canal que posee asignado el Trigger al canal de la señal a afectar (en el caso de ser FL Studio como
se muestra en la imagen, se hace click derecho en la flecha inferior y a continuacion “Sidechain to this track”, lo cual generará un enlace entre ambos canales).</br>
</br>
<div class="popup" id="popup_daw">
<p>Una estación de trabajo de audio digital (EAD) o DAW por sus siglas en inglés (Digital Audio Workstation) es un sistema electrónico dedicado a la grabación y edición de audio digital por medio de un software de edición de audio.</p>
</div>
</div>
</article>
</div>