Colocar gadget flotante estilo Facebook/9gag en Blogger

  • Autor Autor mz89
  • Fecha de inicio Fecha de inicio
M

mz89

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola quisiera saber si alguno de ustedes sabe como colocar un gadget flotante con un efecto estilo facebook/ 9gag, que se encuentre en la parte inferior de la barra lateral y al llegar a este se quede fijo en la parte superior de la ventana del navegador.

encontré este tutorial (en ingles). Pero me descompone un slider que tengo en el blog y no logran el efecto deseado, ya que se quedan fijos en la parte superior. Requiriendo tener labarra completamente vacía.

Enlace eliminado

Es para poner una imagen con publicidad a un articulo propio. :thrasher:
 
Si mal no estoy, es una propiedad en CSS la que tienes que agregar, que al tocar el widget el top de tu navegador, este continua bajando, en realidad baja todo el bloque, lo que hace que paresca que te sigue es porque el fondo lo simulas lo más posible...
 
El efecto concretamente es como se ve en este demo Enlace eliminado

y este es un tutorial Enlace eliminado

La idea sería; adaptarlo para hacer flotar el ultimo gadget del sidebar y no desperdiciar el espacio que queda en blanco cuando bajamos con el scroll.

Y al ser un gadget pues imagino que tendría muchísimas utilidades, como; usarlo para cajas de seguidores / suscripciones, post populares, menú de etiquetas, buscador, banner publicitario propio o de terceros (si lo permiten), o cualquier post o contenido que nos convenga destacar...

¿Alguien sabe como o se anima a crear un tutorial?. Yo no puedo porque soy un NOVATO así con mayusculas... jeje 🙄
 
buenas!
mira yo tuve el mismo problema cn el fanbox de facebook q tengo en mi sitio...me descomponia el slider...el problema esta en esta linea

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js">

ese codigo seguramente ya lo tengas en la plantilla y al ponerlo otra vez se descompone todo...simplemente borra y q te quede asi nomas:

<script type='text/javascript'>
$(document).ready(function () {
var top = $('#banner').offset().top - parseFloat($('#banner').css('marginTop').replace(/auto/, 0));
$(window).scroll(function (event) {
var y = $(this).scrollTop();

if (y >= top) {
$('#banner').addClass('fixed');
} else {
$('#banner').removeClass('fixed');
}
});
});
</script>

salu2
 
Atrás
Arriba