Usé mi tiempo libre para escribir un ejemplo de navegar por una sola imagen cuando estaba aprendiendo JavaScript:
La copia del código es la siguiente:
<! Doctype html público "-// w3c // dtd html 4.0 transitional // en">
<html>
<Evista>
<title> Image Gallery </title>
<Meta name = "generador" content = "editplus">
<Meta name = "autor" content = "">
<Meta name = "Keywords" content = "">
</ablo>
<script language = "javaScript">
función showpic (whatpic) {
var fource = whatpic.getAttribute ("href"); // Obtener el valor del atributo href del elemento actualmente haciendo clic actualmente
VAR PLADELDERTER = document.getElementById ("Posición de posicionador"); // Obtener el objetivo
PLADELDER.SetAttribute ("SRC", fuente); // Establezca el atributo de destino SRC para cambiar la imagen
var text = whatpic.getAttribute ("title"); // Obtener el valor del título de atributo del elemento actualmente haciendo clic actualmente
Var Descripción = Document.getElementById ("Descripción");
descripción.firstchild.nodevalue = text; // Asigna el título del elemento Click a <p>
// o descripción.childnodes [0] .nodeValue = text;
}
</script>
<Body>
<h1> JavaScript Picture Gallery </h1>
<ul>
<li>
<a href = "images/fireworks.jpg" onClick = "showPic (this); return false;"> pic1 </a>
</li>
<li>
<a href = "imágenes/Coffee.jpg" onClick = "showpic (this); return false;"> imagen 2 </a>
</li>
<li>
<a href = "imágenes/rosa.jpg" onClick = "showpic (this); return false;"> Pic tres </a>
</li>
<li>
<a href = "imágenes/bigben.jpg" onClick = "showpic (this); return false;"> imagen 4 </a>
</li>
</ul>
<img id = "Posición de posición" src = "Images /PlaceHolder.gif" />
<P id = "Descripción"> Seleccionar imagen. </p>
</body>
</Html>
Aviso:
Deberíamos prestar atención a agregar eventos a la etiqueta <a> </a> para evitar que realice saltos.
Solución: la función devuelve falso; El evento cree que el enlace no se ha hecho clic.
Si el valor de HREF es JavaScript: Void (0); Tampoco puede saltar.