Los que utilizan jQuery en su blog pueden dar un aspecto diferente a los enlaces con Nudging.js el efecto es un sutil movimiento al pasar el puntero sobre el enlace.
Para añadirlo nos situamos en plantilla edición HTML y justo antes de </head> añadimos lo siguiente:

<script type='text/javascript'>
// <![CDATA[
$(document).ready(function() {
$('a.nudge').hover(function() { //mouse in
$(this).animate({ paddingLeft: '45px' }, 400);
}, function() { //mouse out
$(this).animate({ paddingLeft: '1px' }, 400);
});
});
//]]>
</script>

Si no estamos utilizando jQuery y es la primera vez que vamos a utilizarlo entonces también añadiremos justo antes del anterior:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js' type='text/javascript'/>

Guardamos los cambios y queda crear los enlaces, si los añadimos en un gadget escogeremos HTML/Javascript



Url-enlace añadimos la url del sitio que vamos a enlazar.
Texto-enlace es el texto que visualizamos y hará de enlace.
Url-imagen añadiremos la url dela imagen a mostrar.
Url-icono-bullets es el lugar para añadir la url del icono o bullet.
Cadete

Perdona mi ignorancia, pero yo tengo creado un blog con el nuevo diseñador de Blogger y no sé si utiliza jQuery...

Muchas gracias.

Responder
Gem@

:: Hola Cadete, no tienes jQuery, estás usando Prototype y Scriptaculous es una librería distinta a jQuery y puede crear algún tipo de conflictos si añades las dos :S

Responder
@rielCastellanos

No hay manera de hacer esto con css3?

Responder
Gama Cero

Gran efecto.
JQuery, insuperable.

Saludos!

Responder
JAIME

Hola Campeona, saludos. Lo intente, lo vi chiquito y dije "haaa facilito"...no me saleeeee:S

LO puse aqui:

http://listamenuyservicios.blogspot.com/

El html esta puesto en dos sitios: arriba dentro del codigo de la plantilla y abajo en un gadget HTML, no se q pasa Gem@ (??)

Responder
Gem@

:: @rielCastellanos se puede intentar añadiendo mayor margen izquierdo con hover, con eso mostraría el enlace desplazado pero no el mismo efecto deslizante :S

:: Gama Cero insuperable no sé pero da mucho juego :)

:: JAIME altera el orden de los scripts y sitúa jquery.min el primero y luego Nudging.js :) lo rectifiqué en la entrada por si alguien más tiene ese problema :)

Responder
Cadete

@Gem@

Muchas gracias Gema, algo de eso creí pero no lo tenía muy claro.

Un saludo.

Responder
JAIME

Yaaaaaa, ahora si pues, quedo de lujo, miralo aqui:

http://www.visatperu.com/

buen aporte Gemita linda :D gracias mil !!

Responder
Gem@

:: Buen trabajo Jaime!! pero los enlaces son lo de menos es el diseño lo que ha quedado de lujo :)

Responder
JAIME

No!! ni los enlaces ni el diseño, la q es de lujo esa... eres TU, gracias!!

Responder
Gem@

:: Ohh :$ gracias.

Responder
miyares

Me dejas asonmbrado con tu sabiduría sobre el diseño de blogs.Hay que saber mucho de páginas y estar muy al día,tengo dos y trabajo con bloguer que te lo da todo hecho pero es diferente.En hora buena.Miyares

Responder
Gem@

:: miyares en lugar de sabiduría yo lo llamaría curiosidad :D de páginas no sé ni la cuarta parte de lo que me gustaría saber. Blogger es muy completo y de un tiempo a esta parte ha añadido mejores que es para quitarse el sombre, le quedan algunos detalles y ya sería lo máximo pero está bien, muy bien. Gracias por comentar :)

Responder
Nadie

Hola Gema. Muy buena entrada. Lo que te digo no tiene que ver nada con ella. He añadido poner emoticonos en los comentarios, y para ello utilicé el blog de Vku, lo que ocurre es que me sale un spam publicitario, Para arreglarlo y que no me aparezca estoy subiéndome mis bichitos a dropbox, es mejor utilizar otro alojamiento? Gracias. Mi blog es :
http://lacasadelaspalabrass.blogspot.com/

Responder
Gem@

:: Nadie no veo la publicidad pero respondiendo a tu pregunta te diré que en mi opinión el mejor sitio para alojar imágenes es Blogger o Picasa que viene a ser lo mismo ya que todas las imágenes que subimos quedan alojadas allí.

Responder
Nadie

Gracias Gema, eso será pq he alojado el enlace de VKu en dropbox, y así utilizo mi propio enlace y ha desaparecido la publi, pero tarda más en cargar, como ves no tengo ni idea pero sólo llevo en esto desde Mayo. Creo que al final voy a poner los emoticonos como los tuyos que quedan más elegantes, jajaja A ver si me sale. Y lo haré utilizando Picassa.

Responder
Caa

GENIAL!!!! Y por cierto, TU LOGO SE MUEVE!! que bonito GEM@ :D

Responder
Gem@

:: Caa el efecto del logo es el resultado de una prueba y así quedó :)

Responder
mikotube

eso es posible ponerlo en las etiquetas? : D
saludos y gracias por todo

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:) :'( :( :P :D :$ ;) :-I :X :O |O :S

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

 


top