Foros del Web » Creando para Internet » HTML »

Utilizar imágenes en diferentes navegadores

 Estas en el tema de Utilizar imágenes en diferentes navegadores en el foro de HTML en Foros del Web. Hola gente, verán, soy muy novato en html (por no decir que no se absolutamente nada), y estoy trabajando en una entrega para aprobar un ...
  #1 (permalink)  
Antiguo 15/01/2013, 13:53
Avatar de adrianBenjuya  
Fecha de Ingreso: noviembre-2012
Mensajes: 20
Antigüedad: 12 años
Puntos: 0
Pregunta Utilizar imágenes en diferentes navegadores
Hola gente, verán, soy muy novato en html (por no decir que no se absolutamente nada), y estoy trabajando en una entrega para aprobar un examen final de JAVA. En realidad lo que tengo que saber hacer son servlets pero necesito si o si del formulario, y ya que es un trabajo final, necesito un formulario LINDO. A raíz de eso se me ocurrió ponerle imágenes. Una vez que termino de diseñar la página y la ejecuto en un navegador resulta que en el único en el que puedo visualizar las imágenes es en nuestro querido internet explorer... en los demás ni las veo.

Alguno sabe qué hay que agregarle al código para que esto se solucione?? en realidad no es algo tan importante para mi que no se visualicen en los navegadores, el tema es que tampoco las puedo ver en el navegador que trae Eclipse EE cuando estoy trabajando con los servlets, y eso es muy necesario para mi ya que a las imágenes tengo que insertarlas y borrarlas dependiendo de los parámetros que envía el usuario en el formulario.

Muchas gracias, saludos.

PD: para crear las páginas web utilizo WYSIWYG Web Builder 8
  #2 (permalink)  
Antiguo 15/01/2013, 14:06
Avatar de pzin
Moderata 😈
  
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Utilizar imágenes en diferentes navegadores
Pues raro es que no se vea una imagen normal y corriente más que en IE. Aunque si se ve en IE y en los demás no, el diagnóstico es claro y contundente; algo está mal e IE lo interpreta mal.

Lo único que tienes que poner para que se vea una imagen, es la etiqueta img:
Código HTML: 
Ver original
  1. <img src="ruta/imagen.png" />

Aunque puede ser que el problema venga por elementos adyacentes. De todas formas, sin ver código, difícilmente se podrá saber cual es el problema.
  #3 (permalink)  
Antiguo 16/01/2013, 05:21
Avatar de adrianBenjuya  
Fecha de Ingreso: noviembre-2012
Mensajes: 20
Antigüedad: 12 años
Puntos: 0
Respuesta: Utilizar imágenes en diferentes navegadores
Las etiquetas están, las rutas estan bien puestas (todo generado por el editor), pensé que por ahi necesitaba algún tipo de código especial para utilizarla en otros navegadores.

Te dejo el código

Código: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Página sin título</title>
<meta name="generator" content="WYSIWYG Web Builder 8 - http://www.wysiwygwebbuilder.com">
<style type="text/css">
body
{
   background-color: #FFFFFF;
   color: #000000;
}
</style>
<style type="text/css">
a
{
   color: #C8D7EB;
   outline: none;
   text-decoration: underline;
}
a:visited
{
   color: #C8D7EB;
}
a:active
{
   color: #C8D7EB;
}
a:hover
{
   color: #376BAD;
   text-decoration: underline;
}
</style>
<style type="text/css">
#wb_Text1 
{
   background-color: transparent;
   border: 0px #000000 solid;
   padding: 0;
}
#wb_Text1 div
{
   text-align: left;
}
#wb_Text2 
{
   background-color: transparent;
   border: 0px #000000 solid;
   padding: 0;
}
#wb_Text2 div
{
   text-align: left;
}
#wb_Text3 
{
   background-color: transparent;
   border: 0px #000000 solid;
   padding: 0;
}
#wb_Text3 div
{
   text-align: left;
}
#wb_Text4 
{
   background-color: transparent;
   border: 0px #000000 solid;
   padding: 0;
}
#wb_Text4 div
{
   text-align: left;
}
#Editbox1
{
   border: 1px #C0C0C0 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#Editbox2
{
   border: 1px #C0C0C0 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#wb_Text5 
{
   background-color: transparent;
   border: 0px #000000 solid;
   padding: 0;
}
#wb_Text5 div
{
   text-align: left;
}
#wb_Text6 
{
   background-color: transparent;
   border: 0px #000000 solid;
   padding: 0;
}
#wb_Text6 div
{
   text-align: left;
}
#wb_Text7 
{
   background-color: transparent;
   border: 0px #000000 solid;
   padding: 0;
}
#wb_Text7 div
{
   text-align: left;
}
#Image1
{
   border: 0px #000000 solid;
}
#Image2
{
   border: 0px #000000 solid;
}
#Image3
{
   border: 0px #000000 solid;
}
#Image4
{
   border: 0px #000000 solid;
}
#Image5
{
   border: 0px #000000 solid;
}
#Image6
{
   border: 0px #000000 solid;
}
#Image7
{
   border: 0px #000000 solid;
}
#Image8
{
   border: 0px #000000 solid;
}
#Image9
{
   border: 0px #000000 solid;
}
#Image10
{
   border: 0px #000000 solid;
}
#Image11
{
   border: 0px #000000 solid;
}
#Image12
{
   border: 0px #000000 solid;
}
#Image13
{
   border: 0px #000000 solid;
}
#Image14
{
   border: 0px #000000 solid;
}
#Image15
{
   border: 0px #000000 solid;
}
#Image16
{
   border: 0px #000000 solid;
}
</style>
</head>
<body>
<div id="wb_Text1" style="position:absolute;left:357px;top:25px;width:61px;height:32px;z-index:0;">
<span style="color:#000000;font-family:Arial;font-size:27px;"><strong>NIM</strong></span></div>
<div id="wb_Text2" style="position:absolute;left:85px;top:84px;width:179px;height:19px;z-index:1;">
<span style="color:#000000;font-family:Arial;font-size:16px;"><strong>Vos</strong></span></div>
<div id="wb_Text3" style="position:absolute;left:51px;top:125px;width:128px;height:16px;z-index:2;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Fila</span></div>
<div id="wb_Text4" style="position:absolute;left:51px;top:154px;width:147px;height:16px;z-index:3;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Cantidad</span></div>
<input type="text" id="Editbox1" style="position:absolute;left:116px;top:121px;width:44px;height:18px;line-height:18px;z-index:4;" name="Editbox1" value="">
<input type="text" id="Editbox2" style="position:absolute;left:117px;top:150px;width:44px;height:18px;line-height:18px;z-index:5;" name="Editbox1" value="">

<button id="AdvancedButton1" type="button" name="" value="" style="position:absolute;left:48px;top:192px;width:119px;height:34px;z-index:7;"><div style="text-align:center"><span style="color:#000000;font-family:Arial;font-size:13px">Jugar</span></div></button>
<div id="wb_Text5" style="position:absolute;left:81px;top:279px;width:179px;height:19px;z-index:8;">
<span style="color:#000000;font-family:Arial;font-size:16px;"><strong>Máquina</strong></span></div>
<div id="wb_Text6" style="position:absolute;left:53px;top:319px;width:128px;height:16px;z-index:9;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Fila:</span></div>
<div id="wb_Text7" style="position:absolute;left:52px;top:349px;width:147px;height:16px;z-index:10;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Cantidad:</span></div>
<div id="wb_Image1" style="position:absolute;left:452px;top:87px;width:25px;height:84px;z-index:11;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image1" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image2" style="position:absolute;left:446px;top:190px;width:26px;height:81px;z-index:12;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image2" alt="" border="0" style="width:26px;height:81px;"></div>
<div id="wb_Image3" style="position:absolute;left:438px;top:293px;width:27px;height:80px;z-index:13;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image3" alt="" border="0" style="width:27px;height:80px;"></div>
<div id="wb_Image4" style="position:absolute;left:434px;top:393px;width:23px;height:83px;z-index:14;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image4" alt="" border="0" style="width:23px;height:83px;"></div>
<div id="wb_Image5" style="position:absolute;left:509px;top:190px;width:25px;height:84px;z-index:15;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image5" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image6" style="position:absolute;left:501px;top:295px;width:25px;height:84px;z-index:16;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image6" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image7" style="position:absolute;left:497px;top:394px;width:25px;height:84px;z-index:17;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image7" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image8" style="position:absolute;left:564px;top:296px;width:25px;height:84px;z-index:18;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image8" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image9" style="position:absolute;left:560px;top:395px;width:25px;height:84px;z-index:19;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image9" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image10" style="position:absolute;left:622px;top:396px;width:25px;height:84px;z-index:20;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image10" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image11" style="position:absolute;left:381px;top:188px;width:25px;height:84px;z-index:21;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image11" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image12" style="position:absolute;left:370px;top:293px;width:25px;height:84px;z-index:22;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image12" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image13" style="position:absolute;left:363px;top:394px;width:23px;height:81px;z-index:23;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image13" alt="" border="0" style="width:23px;height:81px;"></div>
<div id="wb_Image14" style="position:absolute;left:304px;top:290px;width:25px;height:84px;z-index:24;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image14" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image15" style="position:absolute;left:295px;top:390px;width:25px;height:84px;z-index:25;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image15" alt="" border="0" style="width:25px;height:84px;"></div>
<div id="wb_Image16" style="position:absolute;left:228px;top:389px;width:25px;height:84px;z-index:26;padding:0;">
<img src="images/Sin%20t%EDtulo.png" id="Image16" alt="" border="0" style="width:25px;height:84px;"></div>
</body>
</html>
La página en realidad es un juego, uno ingresa la fila y la cantidad de fósforos que quiere sacar y luego la máquina en base a tu jugada hace otra, eliminando una cantidad de fósforos. Al eliminar los fósforos lo que pretendo hacer es borrar la imagen del fósforo. Se utiliza la misma imagen del fósforo 16 veces.
  #4 (permalink)  
Antiguo 16/01/2013, 05:57
Avatar de emprear
Colaborador
  
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: Utilizar imágenes en diferentes navegadores
Por lo pronto remové los acentos y espacios en blanco de los nombres de las imágenes

Sin%20t%EDtulo.png --> Sintitulo.png

Y respetá mayúsculas minúsculas llegado el caso

SAludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #5 (permalink)  
Antiguo 16/01/2013, 07:01
Avatar de adrianBenjuya  
Fecha de Ingreso: noviembre-2012
Mensajes: 20
Antigüedad: 12 años
Puntos: 0
Respuesta: Utilizar imágenes en diferentes navegadores
Genio! ahí anduvo, muchas gracias!

Etiquetas: formulario, navegadores, página
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 05:02.