jueves, 31 de mayo de 2012

Cute Aviso Flotante By Annyz

ñam ñaamm ^v^ me tarde bastante haciendo este tuto pero valio la pena xD me quedo bien lindo haha

si quieren ver como queda da clic aqui en mi blog de pruebas n.n



para ponerlo como siempre super sencillo

anda a Diseno >> Elementos de Pagina >> Anadir Gadget Html/Javascript y copiar el codigo

Codigo:

<style>
<!--
#postit{
position:fixed; wiidth:350px; padding:15px; background: url(URL DE TU FONDO)center; border: 1px dashed #ffcfe7;-moz-border-radius: 35px;
border-radius: 35px;
border-radius: 1em 4em 1em 4em;

visibility:hidden; z-index:100; cursor:hand; color: black }
-->
</style>
<div id=postit style="left: 420px; top: 150px">
<div align=right><b><a href="javascript:closeit()">CERRAR</a></b></div><br /><center><img src="URL DE TU IMAGEN" /></center>
<!--INSERT YOUR CONTENT HERE-->
AQUI TU MENSAJE
<!--END YOUR CONTENT HERE--><br />

<script type="text/javascript" language="javascript">

//Post-it only once per browser session? (0=no, 1=yes)
//Specifying 0 will cause postit to display every time page is loaded

var once_per_browser=0

///No need to edit beyond here///

var ns4=document.layers
var ie4=document.all
var ns6=document.getElementById&&!document.all

if (ns4)
crossobj=document.layers.postit
else if (ie4||ns6)
crossobj=ns6? document.getElementById("postit") : document.all.postit


function closeit(){
if (ie4||ns6)
crossobj.style.visibility="hidden"
else if (ns4)
crossobj.visibility="hide"
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { // if cookie exists
offset += search.length
// set index of beginning of value
end = document.cookie.indexOf(";", offset);
// set index of end of cookie value
if (end == -1)
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function showornot(){
if (get_cookie('postdisplay')==''){
showit()
document.cookie="postdisplay=yes"
}
}

function showit(){
if (ie4||ns6)
crossobj.style.visibility="visible"
else if (ns4)
crossobj.visibility="show"
}

if (once_per_browser)
showornot()
else
showit()
</script></font></font></div>


Ahora Edita:

Fucsia: Direccion de tu fondito
Lila: Grueso del borde
Verde: Tipo del borde
Naranja: Color del Borde
Cafe: Forma del borde
Azul: Url o direccion de la imagen que estara dentro del mensaje - Trata de que tu imagen no sea tan grande -
Morado: Ahi escribe tu mensaje
Rojo: Como vez hay un letrero de cerrar si quieres que en vez de letritas tenga una imagen borra la palabra CERRAR y pon este codigo.

<img src="URL DE TU IMAGEN" />



No Copy ~~


23 comentarios:

  1. mmm como se sale annyz es muy original me gusto mucho :) besos

    ResponderEliminar
  2. Una pregunta como podrias poner un tutorial para poner el cursor que tienes en tu blog??

    ResponderEliminar
    Respuestas
    1. mmm mejor te paso el cursor asi como lo tengo yo es algo muy sencillo

      solo pega este codigo en un gadget html/java

      <style type=text/css> body{cursor:crosshair} a {cursor: TYPE}</style>


      saludos

      Eliminar
  3. Que lindoo *.* Na minha próxima atualização do blog, vou colocar essa caixinha! Muito cute ♥

    http://candy-bruna.blogspot.com

    ResponderEliminar
  4. Muchas gracias Annyz,me encantan tus tutos ^_^

    ResponderEliminar
  5. ¡Buenísimo! ¡Justo lo que estaba esperando! Por alguna razón, me sospechaba que harías algo así tarde o temprano ^.^ Genial como siempre, Annyz ^_^ ¡Mis 10 para una 10!

    ResponderEliminar
  6. Tan caritativa la Annyz! Siempre ayudando al projimo con sus Blogs!!!!Espero te encuentres bien pase a dejarte saluditos!!! Besooo ^^

    ResponderEliminar
  7. Hola dulzura! Esto si esta buenisimo! Te botastes jajaja uno de tus defectos jajaja!
    Tengo una pregunta, como le hago si quisiera poner en el texto algun enlace que se habra en una nueva pestana?
    Mil gracias princesa! Me encanto!

    ResponderEliminar
    Respuestas
    1. hola marg para que te salga en ottra pestana se utiliza este codigo

      <a href="DIRECCION" target="_blank">Texto enlace</a>

      besos

      Eliminar
    2. Gracias Annyz! Ya lo estoy haciendo, pero una preguntita mas, si quisiera agregarle alguna imagen pequena al lado de alguna parte del texto,cual seria el codigo?

      MIL GRACIAS CORAZON ANTICIPADAS!

      Eliminar
    3. Gracias Annyz! jajaja ya lo hice, aqui puedes checar!
      Bueno tambien ya termine de arreglar el blog completo gracias a tus consejos! He cerrado todas mis paginas para quedarme solo con esta.
      Aqui el resultado!
      http://confiaen-cristo.blogspot.com/
      Muchisimas gracias corazon!
      Un fuerte abrazo!

      Eliminar
    4. okii me da gusto que te haya quedado todo bien y que hayas mirado el tuto sobre los codigos de las fuentes ^^ besos

      Eliminar
  8. asdfghjk que genial!! *-* así cada que tenga algo importante en la sidebar podré avisar así x33 muchas gracias An-chan está genial el tuto

    ResponderEliminar
  9. Nyaaaan ahora lo probare, luego te aviso si hay algun error xD espero que me de resultados *O* besos, increible tu blog :D kawaii nyan nyan nyaaaaan~

    ResponderEliminar
  10. Cada vez más encantada. Me animo a ponerlo, muchas gracias por compartirlo n.n

    ResponderEliminar
  11. mmm lo probe y tuve un error, el cuadro esta muy grande, lo quise achicar poniendo enter por cada oracion qe puse pero sigue igual, y no me quedo en el centro D: que hago? fijate en mi blog:

    http://ichigo-freshita.blogspot.com

    RECUERDA BAJAR EL VOLUMEN ANTES DE ENTRAR XD

    ResponderEliminar
    Respuestas
    1. oka ya lo vi xD y no es un error del script
      lo que pasa es que el texto lo tienes muy largo.. hazlo por frases no tan grandes..

      el texto por defecto esta centrado pero no se ve asi por lo mismo que esta muy largo

      lo otro del espacio no se hace con enter pues no te ayudara.. recuerda que es un html

      por ejemplo :

      bienvenidos a mi blog</b>
      comenta comenta comenta ..etcetc</b>
      be happy ichigo chan </b>

      asi xD

      saludos

      Eliminar
  12. Una pregunta! .. como hago para que el mensaje aparezca solo una ves, osea asi como cuando uno entra la primera ves y ya? .. esque uno cambia a otro lugar del blog y aparece otra ves ;-; y es como agobiante xD ..

    ResponderEliminar
    Respuestas
    1. ahh bueno donde dice

      var once_per_browser=0

      cambia el cero por un 1

      asi:

      var once_per_browser=1

      y listo

      Eliminar
    2. pero sabes creo que desaparecera totalmente.. ya investigo si no te funciona.. saludos

      Eliminar

Nota: solo los miembros de este blog pueden publicar comentarios.