Construcción web

La puerta corredera más simple implementada por js

Recientemente en el aprendizaje de JS, antes de buscar JS efectos especiales, están en línea para encontrar código, más tarde encontró que algunos efectos especiales pueden no ser adecuados para sí mismos, necesita modificar la modificación no entiende, que [...]

Catálogo de artículos

Recientemente, en el estudio de JS, cuando buscaba efectos especiales de JS antes, iba a buscar código en línea. Más tarde, descubrió que algunos efectos especiales pueden no ser adecuados para sí mismos. Necesitaba revisar y revisar. No entiendo. Entonces, qué hacer, aprender. Recientemente, en el aprendizaje de JS espero que los amigos de JS se comuniquen más, no dijo mucho sobre los efectos de puerta deslizante con muy pocos códigos a continuación.

<div class="top_nav_news_right" >
<div class="index_news_right_top" >
<ul>
<li>&lt; span class="hdm_01′′ id="hdm0′′ onmousemove="javascript:hd(0);"&gt; Recomendado</span></li>
<li>&lt;span id="hdm1′′ onmousemove="javascript:hd(1);"&gt;</span></li>
<li>&lt;span id="hdm2′′ onmousemove="javascript:hd(2);"&gt; puntos de acceso</span></li>
<li>&lt;span id="hdm3′′ onmousemove="javascript:hd(3);"&gt; agregación</span></li>
</ul>
</div>
&lt;div class="news_right_content" style="display:block;" id="tx_hd0′′&gt;
<ul>
<li>&lt; a href = "#" &gt; 1QQ Chat Assistant es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
</ul>
</div>
&lt;div class="news_right_content" style="display:none;" id="tx_hd1′′&gt;
<ul>
<li>&lt; a href = "#" &gt; 2QQ Chat Assistant es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
</ul>
</div>
&lt;div class="news_right_content" style="display:none;" id="tx_hd2′′&gt;
<ul>
<li>&lt; a href = "#"&gt; 3QQ Chat Assistant es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
</ul>
</div>
&lt;div class="news_right_content" style="display:none;" id="tx_hd3′′&gt;
<ul>
<li>&lt; a href = "#"&gt; 4QQ Chat Assistant es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
<li>&lt; a href = "#" &gt; El asistente de chat QQ es más fácil de buscar mientras hablamos</a></li>
</ul>
</div>
</div>
<script>
Función hd(num){

for (var id = 0; id &lt; 4; id++)
{
si (id = = número)
{
document.getElementById("tx_hd"+id).style.display="block";
document.getElementById("hdm"+id).className="bg_block";
}
Otras
{
document.getElementById("tx_hd"+id).style.display="none";
document.getElementById("hdm"+id).className="bg_none";
}
}
}</script>

Algunos amigos copiaron el código y descubrieron cómo la página estaba tan desordenada, eso es normal. Porque no hay estilo en él. La página se puede usar directamente.