Foros del Web » Programando para Internet » Javascript »

[SOLUCIONADO] Añadir más imagenes

 Estas en el tema de Añadir más imagenes en el foro de Javascript en Foros del Web. Buenos días amigos del Foro. Como podría añadir más imagenes en este JavaScript, ya que tal como está solo admite 4 imagenes, no más: @import ...
  #1 (permalink)  
Antiguo 04/08/2011, 02:23
Avatar de seoista  
Fecha de Ingreso: septiembre-2003
Ubicación: Pues leyéndote
Mensajes: 1.076
Antigüedad: 20 años, 7 meses
Puntos: 59
Pregunta Añadir más imagenes
Buenos días amigos del Foro.

Como podría añadir más imagenes en este JavaScript, ya que tal como está solo admite 4 imagenes, no más:
Código Javascript: 
Ver original
  1. <script type="text/javascript">
  2.  
  3. // 7 variables to control behavior
  4.     var Book_Image_Width=140;
  5.     var Book_Image_Height=225;
  6.     var Book_Border=true;
  7.     var Book_Border_Color="gray";
  8.     var Book_Speed=15;
  9.     var Book_NextPage_Delay=1500; //1 second=1000
  10.     var Book_Vertical_Turn=0;   
  11.  
  12. // array to specify images and optional links. At least 4
  13. // If Link is not needed keep it ""
  14.  
  15.     Book_Image_Sources=new Array(
  16.         "photo1.jpg","http://www.google.com",
  17.         "photo2.jpg","http://www.google.com",
  18.         "photo3.jpg","www.google.com",
  19.         "photo4.jpg","http://www.codingforums.com" // NOTE No comma after last line
  20.         );
  21.  
  22. /***************** DO NOT EDIT BELOW **********************************/
  23.     var B_LI,B_MI,B_RI,B_TI,B_Angle=0,B_CrImg=6,B_MaxW,B_Direction=1;
  24.     var B_MSz,B_Stppd=false;B_Pre_Img=new Array(Book_Image_Sources.length);
  25.  
  26.     function ImageBook(){
  27.         if(document.getElementById){
  28.             for(i=0;i<Book_Image_Sources.length;i+=2){
  29.                 B_Pre_Img[i]=new Image();B_Pre_Img[i].src=Book_Image_Sources[i]}
  30.             Book_Div=document.getElementById("Book");
  31.             B_LI=document.createElement("img");Book_Div.appendChild(B_LI);  
  32.             B_RI=document.createElement("img");Book_Div.appendChild(B_RI);
  33.             B_MI=document.createElement("img");Book_Div.appendChild(B_MI);  
  34.             B_LI.style.position=B_MI.style.position=B_RI.style.position="absolute";
  35.             B_LI.style.zIndex=B_RI.style.zIndex=0;B_MI.style.zIndex=1;
  36.             B_LI.style.top=(Book_Vertical_Turn?Book_Image_Height+1:0)+"px";
  37.             B_LI.style.left=0+"px";
  38.             B_MI.style.top=0+"px";
  39.             B_MI.style.left=(Book_Vertical_Turn?0:Book_Image_Width+1)+"px";
  40.             B_RI.style.top=0+"px";
  41.             B_RI.style.left=(Book_Vertical_Turn?0:Book_Image_Width+1)+"px";
  42.             B_LI.style.height=Book_Image_Height+"px";
  43.             B_MI.style.height=Book_Image_Height+"px";
  44.             B_RI.style.height=Book_Image_Height+"px";
  45.             B_LI.style.width=Book_Image_Width+"px";
  46.             B_MI.style.width=Book_Image_Width+"px";
  47.             B_RI.style.width=Book_Image_Width+"px";
  48.             if(Book_Border){
  49.                 B_LI.style.borderStyle=B_MI.style.borderStyle=B_RI.style.borderStyle="solid";
  50.                 B_LI.style.borderWidth=1+"px";
  51.                 B_MI.style.borderWidth=1+"px";
  52.                 B_RI.style.borderWidth=1+"px";
  53.                 B_LI.style.borderColor=B_MI.style.borderColor=B_RI.style.borderColor=Book_Border_Color}
  54.             B_LI.src=B_Pre_Img[0].src;
  55.             B_LI.lnk=Book_Image_Sources[1];
  56.             B_MI.src=B_Pre_Img[2].src;
  57.             B_MI.lnk=Book_Image_Sources[3];
  58.             B_RI.src=B_Pre_Img[4].src;
  59.             B_RI.lnk=Book_Image_Sources[5];
  60.             B_LI.onclick=B_MI.onclick=B_RI.onclick=B_LdLnk;
  61.             B_LI.onmouseover=B_MI.onmouseover=B_RI.onmouseover=B_Stp;
  62.             B_LI.onmouseout=B_MI.onmouseout=B_RI.onmouseout=B_Rstrt;
  63.             BookImages()}}
  64.  
  65.     function BookImages(){
  66.         if(!B_Stppd){
  67.             if(Book_Vertical_Turn){
  68.                 B_MSz=Math.abs(Math.round(Math.cos(B_Angle)*Book_Image_Height));
  69.                 MidOffset=!B_Direction?Book_Image_Height+1:Book_Image_Height-B_MSz;
  70.                 B_MI.style.top=MidOffset+"px";
  71.                 B_MI.style.height=B_MSz+"px"}
  72.             else{   B_MSz=Math.abs(Math.round(Math.cos(B_Angle)*Book_Image_Width));
  73.                 MidOffset=B_Direction?Book_Image_Width+1:Book_Image_Width-B_MSz;
  74.                 B_MI.style.left=MidOffset+"px";
  75.                 B_MI.style.width=B_MSz+"px"}
  76.             B_Angle+=Book_Speed/720*Math.PI;
  77.             if(B_Angle>=Math.PI/2&&B_Direction){
  78.                 B_Direction=0;
  79.                 if(B_CrImg==Book_Image_Sources.length)B_CrImg=0;
  80.                 B_MI.src=B_Pre_Img[B_CrImg].src;
  81.                 B_MI.lnk=Book_Image_Sources[B_CrImg+1];
  82.                 B_CrImg+=2}
  83.             if(B_Angle>=Math.PI){
  84.                 B_Direction=1;
  85.                 B_TI=B_LI;
  86.                 B_LI=B_MI;
  87.                 B_MI=B_TI;
  88.                 if(Book_Vertical_Turn)B_MI.style.top=0+"px";
  89.                 else B_MI.style.left=Book_Image_Width+1+"px";           
  90.                 B_MI.src=B_RI.src;
  91.                 B_MI.lnk=B_RI.lnk;
  92.  
  93.                 setTimeout("Book_Next_Delay()",Book_NextPage_Delay)}
  94.             else setTimeout("BookImages()",50)}
  95.         else setTimeout("BookImages()",50)}
  96.  
  97.     function Book_Next_Delay(){
  98.             if(B_CrImg==Book_Image_Sources.length)B_CrImg=0;
  99.             B_RI.src=B_Pre_Img[B_CrImg].src;
  100.             B_RI.lnk=Book_Image_Sources[B_CrImg+1];
  101.             B_MI.style.zIndex=2;
  102.             B_LI.style.zIndex=1;
  103.             B_Angle=0;
  104.             B_CrImg+=2;
  105.         setTimeout("BookImages()",50)}
  106.  
  107.     function B_LdLnk(){if(this.lnk)window.location.href=this.lnk}
  108.     function B_Stp(){B_Stppd=true;this.style.cursor=this.lnk?"pointer":"default"}
  109.     function B_Rstrt(){B_Stppd=false}
  110. </script>
  111.  
  112. <body onload="ImageBook()">
  113. <div id="Book" style="position:relative">
  114. <img src="placeholder.gif" width="144" height="227">
  115. </div>
  116. </body>

Muchas gracias y saludos.
__________________
· No contesto por M.P.
  #2 (permalink)  
Antiguo 04/08/2011, 03:02
Avatar de ceSharp  
Fecha de Ingreso: octubre-2008
Ubicación: Madrid
Mensajes: 495
Antigüedad: 15 años, 6 meses
Puntos: 66
Respuesta: Añadir más imagenes
hola seoista,

se añaden más imágenes en el array Boo_Image_Sources. Este es su estado actual
Código Javascript: 
Ver original
  1. Book_Image_Sources=new Array(
  2.         "photo1.jpg","http://www.google.com",
  3.         "photo2.jpg","http://www.google.com",
  4.         "photo3.jpg","www.google.com",
  5.         "photo4.jpg","http://www.codingforums.com" // NOTE No comma after last line
  6.         );
y puedes añadir más de esta manera
Código Javascript: 
Ver original
  1. Book_Image_Sources=new Array(
  2.         "photo1.jpg","http://www.google.com",
  3.         "photo2.jpg","http://www.google.com",
  4.         "photo3.jpg","www.google.com",
  5.         "photo4.jpg","http://www.codingforums.com",
  6. "photo5.jpg","http://www.google.com",
  7.         "photo6.jpg","http://www.google.com",
  8.         "photo7.jpg","www.google.com",
  9.         "photo8.jpg","http://www.codingforums.com" // NOTE No comma after last line
  10.         );
digamos que este array está dividido en posicion impar para la imagen, posición par para su link, y así sucesivamente (o al menos así le entiendo yo). De tal manera que puedes seguir aumentando imagenes y rutas hasta el infinito. Y como bien dice el comentario, después del último par imagen/link no hay que poner coma.

saludos.
  #3 (permalink)  
Antiguo 04/08/2011, 13:45
Avatar de seoista  
Fecha de Ingreso: septiembre-2003
Ubicación: Pues leyéndote
Mensajes: 1.076
Antigüedad: 20 años, 7 meses
Puntos: 59
Respuesta: Añadir más imagenes
Cita:
Iniciado por ceSharp Ver Mensaje
Y como bien dice el comentario, después del último par imagen/link no hay que poner coma.
saludos.
Muchas gracias ceSharp, no había comprendido lo de: // NOTE No comma after last line (¡la dificultad de no saber inglés!) y yo ponía el último imagen/link con la coma.

Ahora va bien y repito muchas gracias.

Saludos.
__________________
· No contesto por M.P.

Etiquetas: imagenes
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 06:22.