Ver Mensaje Individual
  #2 (permalink)  
Antiguo 27/12/2013, 22:04
Avatar de Alexis88
Alexis88
Philosopher
 
Fecha de Ingreso: noviembre-2011
Ubicación: Tacna, Perú
Mensajes: 5.551
Antigüedad: 12 años, 4 meses
Puntos: 977
Respuesta: Cambiar URL de un iframe al presionar un Boton

Podrías crear un pseudo-atributo para cada botón, en donde estaría la dirección que debe de cambiarse en el atributo src del iframe. Un pequeño ejemplo:


El documento HTML, en el que están el iframe y los botones
Código HTML:
Ver original
  1. <iframe id = "capa"></iframe>
  2. <button data-link = "pagina1.html">ARRIBA</button>
  3. <button data-link = "pagina2.html">ABAJO</button>
  4. <button data-link = "pagina3.html">IZQUIERDA</button>
  5. <button data-link = "pagina4.html">DERECHA</button>

El documento JavaScript, en donde se realizará el proceso
Código Javascript:
Ver original
  1. var botones = document.getElementsByTagName("button"),
  2.     iframe = document.getElementById("capa"),
  3.     sizeBotones = botones.length;
  4.  
  5. for (i = 0; i < sizeBotones; i++){
  6.     botones[i].addEventListener("click", function(){
  7.         iframe.src = this.getAttribute("data-link");
  8.     }, false);
  9. }

Básicamente, tomo los cuatro botones, los inserto en un array y con ayuda de un bucle, le asigno a cada uno el evento "click" para que cuando se pulse cada botón, se le asigne al atributo src del iframe, el valor del pseudo-atributo data-link del botón que es en donde está contenida la dirección.

Saludos
__________________
«Juro por mi vida y mi amor por ella, que jamás viviré para el provecho de otro hombre, ni le pediré a otro hombre que viva para el mío».

Ayn Rand

Última edición por Alexis88; 28/12/2013 a las 09:22