lunes, 7 de mayo de 2012

Aviso Deslizante Clic Aqui [Como El Mio]

bLogueritas como estan n.n? como ven por fin les pongo este tuto *v* ~~
no sabia como ponerle de titulo xD haha pero wenoo ya quedo y para irnos rapidito xD

empezamos con los pasitos para que este truco quede en tu blog oki ^^



por si no sabes cual tuto les pondre ahorita da clic en la imagen que esta aqui al costado de mi blog el osito te aparecera una ventanita.

es algo muy sencillito ^^

anda a diseno https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo7RrMXo4mbeZnX8aMwD37s3Cij6We8aShp6uSRjXnuZu_-z1udC7zEodGG3sna_r-gpwLo6fm3K87ZelvFJU5WRSDTscVW1A7XPZr7nEhcu5Bxb07uEmvu1DjWhXQAByGEhWlktr-H7i_/s1600/mg154.gif Elementos de Pagina https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo7RrMXo4mbeZnX8aMwD37s3Cij6We8aShp6uSRjXnuZu_-z1udC7zEodGG3sna_r-gpwLo6fm3K87ZelvFJU5WRSDTscVW1A7XPZr7nEhcu5Bxb07uEmvu1DjWhXQAByGEhWlktr-H7i_/s1600/mg154.gif Anadir Gadget Html/Javascript


copia el siguiente codigo y pegalo en el gadget

<center>
<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #ffaad5;
background:#FFFFFF repeat-x bottom center scroll ;
-moz-border-radius:20px;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:url() no-repeat;">

<div style="text-align: center;">
<img src="URL DE LA IMAGEN DE TU PREFERENCIA" />
AQUI TUS ESCRITOS O MENSAJES
</span></div>
</div>
</div>
<br />
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><div >
<span ></span></div></a></a></div>
</div></div>

<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>

<a href="javascript:void(0);"onclick="showHideAT()"/><img class="expando" src="URL DE TU IMAGEN CLIC AQUI" alt="PUSH" title="Click"/></a>
</center>

luego das guardar

Rojo: Grosor del borde

Verde: tipo de borde

Naranja: Color del borde

Lila: color del fondo de la caja

Azul: Ubicacion o alineacion en que quieres que esten tus escritos
-- Center : Si quieres que esten centrados

-- Left: Si quieres que esten a la izquierda
-- Right: Si los quieres a la derecha

Cafe: esta es opcional es solo si acaso quieres poner una imagen o algo asi (como veras yo tengo la imagen de las reglas)

Rosa palido: Tus escritos o mensajes

MOrado: Url de la direccion de tu imagen Clic aqui (como la del osito)

Para escribir tus escritos los tienes que poner entre <br/>:

ejemplo:

hola bienvenido a mi blog
<br/>
espero sea de tu agrado...y sigas visitandome ^^
<br/>
no olvides dejar tu comentario
<br/>
bai y que tengas buen dia n.n


Ahora algunas que hice espero les gusten y si las toman no olviden los creditos ^^



http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/clicaquibyannyzblog.png



http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/clicaquibyannyzblog3.png



http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/clicaquibyannyzblog6.png


http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/clicaquibyannyzblog4.png



http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/clicaquibyannyzblog5.png



http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/clicaquibyannyzblog2.png


http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/clicaquibyannyzblog7.png


http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/clicaquibyannyzblog8.png

No copies mis tutoriales si tomas algo no olvides los creditos xD


54 comentarios:

  1. *-* Waaaa mil Gracias
    Me encanta Me encanta <3
    Para mi proximo dise~o lo utilizare :D

    PD: Una pena que no haiga lo del calendario tipo agenda cierto? u.u Deberian de crearlo yo seria sumamente feliz xD

    Un Besote :D
    Bye Bye

    ResponderEliminar
    Respuestas
    1. haha me da gusto te haya encantadoo n.n

      sobre lo de la agenda sabes que lo mas que se le asimila son algunos gadgets de rainmeter o.o

      Eliminar
    2. Waaa enserio? Es que no utilizo rainmeter u.u Podrias hacer un tuto de como descargarlo? O como utilizarlo porque realmente me confunde un poco por eso nunca lo he utilizado u.u

      Eliminar
    3. sip mira en mascotas para escritorio tengo ahi un tuto y para descargar espero te ayude ^^

      Eliminar
  2. esta muy lindo el tuto... me facino, aunque en lo personal se omo hacrlo, tu lo explicas ta facil ... de veras te admiro jijiji bye

    ResponderEliminar
  3. hola me encanta tu blog :) eres muy amable por lo que veo en las entradas :) yo soy I love pop y te digo que tú eres una genia con el tema blogger ¡te felicito! :DD pero... yo digo no... si le... ¿puedes poner un chat a tu blog?.Para tener otra forma de contactarse. :) te lo recomendaba, puede ser chat de chatango, es seguro si tu lo manejas con cuidado, puedes bannear a los que dicen malas cosas ect ect... poner emoticones videos chat privados. :)

    ResponderEliminar
    Respuestas
    1. aww que linda muchas gracias por tus palabras hacia a mi y hacia mi blog n.n sip mira si tenia chat pero lo tuve que quitar pues hay personas que no tienen nada que hacer y se ponen a insultar:( quiza mas adelantito me decida a ponerlo de nuevo.. una vez intente poner el chatango pero no me gusto xD igual gracias por la sugerencia =D que tengas bonito dia

      Eliminar
  4. ¿cómo creas las imagenes de tu blog?. Me refiero a tus dibujos ...

    ResponderEliminar
    Respuestas
    1. uso el photoshop cs3 en espanol ^^

      Eliminar
    2. xD tengo el mismo pero en inglés ¿los haces amano?.

      Eliminar
    3. nop las imagenes no las hice yo solo las hice render y les puse los letreritos ^^

      Eliminar
    4. Annyz en donde descargaste Photoshop cs3?

      porfavor pasame el link :D

      Eliminar
    5. en la categoria photoshop ahi puse el que yo utilizo .. solo tienes que descargarlo.. saludos

      Eliminar
  5. Que buena onda!! A mi blog personal no le viene mucho, pero al de mi tienda!!! Te pasaste con la idea!! Te quedo muy lindo el blog, te voy a copiar la idea, pero no me patees por favor hahaha!!! Saludos!!!

    ResponderEliminar
    Respuestas
    1. haha grax nena.. me da gusto te haya gustado y te sea util xD besitos y que tengas buen dia ^^

      Eliminar
  6. me encanta el tuto esta tarde me pondre a hacerlo.
    queria avisarte de que patricia una de las creadoras de kawaiicute blog(mi blog) te a otorgado un premio,lo a hecho ella pero yo estoy totalmente de acuerdo de que te lo haya otorgado a ti.Asi que un poco es de parte de las dos

    ResponderEliminar
    Respuestas
    1. aww gracias ya me paso a recogerlo =D besos y gracias a las 2 por tenerme en cuenta n.n

      Eliminar
  7. Me encanta tu Blog amiga! es suuuper liindoooo!!

    ResponderEliminar
  8. ohhhh annyz soy nueva pero tu blog me encanta
    me has ayudado mucho a mejorar el mio
    mil gracias nena me gusta resto todo lo que haces
    los tutos etc...


    THANk's

    ResponderEliminar
  9. olaa annyz soi una gran seguidora te importaria visitar mi blog? minuevoblogguay.blogspot.com el blog lo decore con los toque es y detalitos bonitos y con tus trucos :D porfavor hazte seguidora si qiueres yo tmbn me are del tuyo .D

    ResponderEliminar
  10. grasias annyz por el tuto :)con este truco se puede hcer muchas conbinaciones :D

    ResponderEliminar
    Respuestas
    1. sii la verdad se pueden hacer varias cosas con el xD

      Eliminar
  11. una pregu.. Komo has exo el titulo del blog tan guay que cambia y gira ?? :D

    ResponderEliminar
  12. como as exo ese titulo del blog tan xuli"!!????? Pon un tuto xfii :D

    ResponderEliminar
  13. Muy bueno el tutorial como todos pero oye me llevo varios días buscando como poner en mi blog el rotador de entadas tan precioso que tienes, me podrías decir como se pone por favor???

    ResponderEliminar
    Respuestas
    1. claro nixai ese tuto ya esta en la lista de tutoriales por hacer .. en estos dias ya lo pongo

      Eliminar
  14. Nyaa gracias!! Estaba esperando este tuto desde hace mucho nya, amo tu blog nya! nya nya nya~ besos! nya!

    ResponderEliminar
  15. Aaaa me olvide de algo: TIENES UN PREMIO EN MI BLOG!!! :D

    ResponderEliminar
  16. una pregunta como haces para que tus imagenes den giritos jeje es que me gusta !! :P

    ResponderEliminar
    Respuestas
    1. sip esta muy padre el efecto de que giran este es un tuto que pondre estos dias :P

      Eliminar
  17. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  18. amo tu bloggggggggggggggggggggg!!!!! es precioso!! utilize cosas de tu blog,no importa? :P
    Igual te dejé créditos en mi blog. :)

    ResponderEliminar
  19. Gomenasai por las molestias es que tube un problema TT^TT bien lo pongo pero sin darle ni nada cuando entras en mi blog se ve la mitad del slide en la parte superior derecha , lugo si le das click al osito se abre entero y si le doy se cierra y desaparece normal , luego queda bien el problema es que sin darle ya sale la mitad del mensaje arriba TT^TT nose si me entendiste espero que si TT^TT a y por cierto tu blog es genial *O*

    ResponderEliminar
  20. mi blog es este entra y veras lo que te decia creo que asi entenderas mejor TT^TT (http://harukaede.blogspot.com.es/)

    ResponderEliminar
    Respuestas
    1. sii ya lo mire que raro pero sabes creo es por la plantilla.. cual usas?

      Eliminar
    2. la de viajes TT^TT es que no sabia que plantilla poner y quedaba linda >///< y perdon por las molestias nuevamente TT^TT

      Eliminar
    3. haha nop para nada no son molestias nena n.n, lo que pasa es que si es por la plantilla acabo de probar este truco con la plantilla travel y queda igual.. es por defecto :( yo te recomiendo esta la picture windows asi tendriamos la misma plantilla y ya no tendrias problemas con ninguno de los trucos que aqui cpongo xD es solo una sugerencia.. si no quieres cambiarla lo unico que puedo decirte es que asi se quedara la ventanita a medias u.u

      Eliminar
    4. que vaa muchisimas greciias >//< sii adoro tu blog tiene muchos buenos trucos ^^ enserio que esta genial :D y gracias por atenderme!!

      Eliminar
  21. Annyz :(
    Pliss, pon más cositas de Vocaloid 3:

    ResponderEliminar
    Respuestas
    1. aww claro crista tengo pensado poner unos wallpapersxD

      Eliminar
  22. annyz!
    me encanto esta muy kawaii! >3<
    y bueno cuando puedas te pasas por mi blog es algo simple pero apenas empiezo :S y bueno besos!

    http://yayikawaii.blogspot.com/

    ResponderEliminar
  23. Oye sabes que al empezar el blog esta tu estatus como lo puedo poner para mi blog? por fis espero tu respuesta lo antes posible

    ResponderEliminar
    Respuestas
    1. sorry nena por la demora te paso el link del tutorial okis

      http://annyz-kawaii.blogspot.mx/2012/05/cuadrito-personalizado-con-mensajitos.html

      besos

      Eliminar
  24. Muchas gracias, ya me salio! muy buena idea! Saluditos! (^^^)♥

    ResponderEliminar

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