Autor Tema: Banner a la esquina de la web  (Leído 1306 veces)

Desconectado WildWolf360

  • PHPer@ Fijo
  • ***
  • Mensajes: 192
  • Karma: 8
    • Ver Perfil
Banner a la esquina de la web
« en: 02 de Mayo de 2010, 14:24:47 pm »
Hola muy buenas. Sewguramente con el título sabréis lo que quiero hacer, pero aún así lo explico:

Quisiera que en mi web apareciera una imagen (la mascota de la web) a en la esquina inferior derecha. He estado buscando pero no sé cómo ponerla.

Si me facilitaráis un tutorial de alguna web o alguna cosa, os lo agradecería.


Saludos

Comunidad PHPeros

Banner a la esquina de la web
« en: 02 de Mayo de 2010, 14:24:47 pm »

Desconectado Siquillote

  • PHPero Master
  • ******
  • Mensajes: 4.229
  • Karma: 179
  • Sexo: Masculino
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #1 en: 02 de Mayo de 2010, 14:32:31 pm »

Con un Layer, puedes mover cualaquier texto o imagen donde te plazca.

#Fdo. Physlet

Desconectado westwest

  • PHPero Master
  • ******
  • Mensajes: 2.837
  • Karma: 104
  • Sexo: Masculino
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #2 en: 02 de Mayo de 2010, 14:34:06 pm »
Usando CSS, creas un div o imagen con ID "mascota" por ejemplo:
<div id="mascota"></div>

y pones algo así en CSS:
Código: [Seleccionar]
#mascota {
position: fixed; // Esto significa que quedará independiente del resto de la web
right: 0px; // La distancia hacia la derecha
bottom: 0px; // La distancia hacia el fondo
}

Desconectado WildWolf360

  • PHPer@ Fijo
  • ***
  • Mensajes: 192
  • Karma: 8
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #3 en: 02 de Mayo de 2010, 15:40:58 pm »
Gracias por responder.

Pero tengo un problema: El texto se muestra, pero las imágenes no. Es decir, si pongo texto se ve, pero si pongo imágenes como que no...

Código: [Seleccionar]
<div id="mascota"><img src="images/topofarmer.png"></div>
Código: [Seleccionar]
#mascota {
position: fixed;
right: 0px;
bottom: 0px;
}

¿Sabéis porqué puede ser?

Desconectado westwest

  • PHPero Master
  • ******
  • Mensajes: 2.837
  • Karma: 104
  • Sexo: Masculino
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #4 en: 02 de Mayo de 2010, 15:44:27 pm »
Primero comprueba la URL de la imagen, por si acaso...
Lo que puedes hacer es poner el id directamente a la imagen, a ver que pasa :P
Si aún así no va, ponle a la imagen un z-index alto

Desconectado WildWolf360

  • PHPer@ Fijo
  • ***
  • Mensajes: 192
  • Karma: 8
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #5 en: 02 de Mayo de 2010, 16:53:02 pm »
Poniendo la url completa si que me va, es decir,

Citar
<img id="mascota" src="http://localhost/wordpress/wp-content/themes/Topofarmer/topofarmer.png">

Lo que no me deja es estando dentro del directorio Topofarmer, poner únicamente topofarmer.png (el archivo header.php lleva el código, y está en el directorio Topofarmer también)

Saludos

Desconectado westwest

  • PHPero Master
  • ******
  • Mensajes: 2.837
  • Karma: 104
  • Sexo: Masculino
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #6 en: 02 de Mayo de 2010, 16:54:05 pm »
Poniendo la url completa si que me va, es decir,

Lo que no me deja es estando dentro del directorio Topofarmer, poner únicamente topofarmer.png (el archivo header.php lleva el código, y está en el directorio Topofarmer también)

Saludos
Escribes "topofarmer.png" o "/topofarmer.png"?

Desconectado WildWolf360

  • PHPer@ Fijo
  • ***
  • Mensajes: 192
  • Karma: 8
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #7 en: 02 de Mayo de 2010, 17:12:08 pm »
De las dos maneras, pero en ninguna de ellas aparece la imagen...

Desconectado westwest

  • PHPero Master
  • ******
  • Mensajes: 2.837
  • Karma: 104
  • Sexo: Masculino
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #8 en: 02 de Mayo de 2010, 17:13:46 pm »
Pues no tengo ni idea...

Desconectado WildWolf360

  • PHPer@ Fijo
  • ***
  • Mensajes: 192
  • Karma: 8
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #9 en: 02 de Mayo de 2010, 17:24:47 pm »
Ya ni yo xD

Desconectado Focux

  • PHPero Master
  • ******
  • Mensajes: 1.010
  • Karma: 22
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #10 en: 05 de Mayo de 2010, 21:17:21 pm »
Tambien lo podrías hacer utilizando float.
Mixtiqueros.net

<?PHP
define
(_miNombre, &#39;Focux&#39;);
if(_miNombre == &#39;Focux&#39;): printf(&#39;%s es un programador avanzado&#39;, _miNombre); else: printf(&#39;Tu no eres %s&#39;, _miNombre); endif;
?>

Desconectado westwest

  • PHPero Master
  • ******
  • Mensajes: 2.837
  • Karma: 104
  • Sexo: Masculino
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #11 en: 05 de Mayo de 2010, 21:19:03 pm »
Tambien lo podrías hacer utilizando float.
pero no quedaría estático al bajar la página

Desconectado Focux

  • PHPero Master
  • ******
  • Mensajes: 1.010
  • Karma: 22
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #12 en: 05 de Mayo de 2010, 21:21:24 pm »
No sabía que lo quería estatico pero para eso que use position: fixed
Mixtiqueros.net

<?PHP
define
(_miNombre, &#39;Focux&#39;);
if(_miNombre == &#39;Focux&#39;): printf(&#39;%s es un programador avanzado&#39;, _miNombre); else: printf(&#39;Tu no eres %s&#39;, _miNombre); endif;
?>

Desconectado marco811

  • PHPero Avanzado
  • ****
  • Mensajes: 306
  • Karma: 16
  • Sexo: Masculino
  • ¡¡Hola mundo!!
    • Ver Perfil
    • Personalidad Web
Re:Banner a la esquina de la web
« Respuesta #13 en: 06 de Mayo de 2010, 00:03:27 am »
YO se como hacerlo, lo he echo en un momento:
estilo css:
Código: [Seleccionar]
<style>
#esquina {
    background-image: url(http://santiagodelrio.files.wordpress.com/2009/10/facebook-logo.png);
    background-repeat: no-repeat;
    background-position: top right;
    width: 256px; /* Ancho imagen */
    height: 256px; /* Alto imagen */
    padding-left: 75%; /* posicion hacia la derecha */
}
</style>
codigo html:
<div id="esquina"></div>
Esto es todo, un saludo!

Desconectado Focux

  • PHPero Master
  • ******
  • Mensajes: 1.010
  • Karma: 22
    • Ver Perfil
Re:Banner a la esquina de la web
« Respuesta #14 en: 06 de Mayo de 2010, 02:59:26 am »
Tambien lo puedes hacer con un margin.
Mixtiqueros.net

<?PHP
define
(_miNombre, &#39;Focux&#39;);
if(_miNombre == &#39;Focux&#39;): printf(&#39;%s es un programador avanzado&#39;, _miNombre); else: printf(&#39;Tu no eres %s&#39;, _miNombre); endif;
?>