Código CSS y JS para sidebar flotante en Blogger

anferro · 12 May 2014

Hola betas la verdad ya me canse de buscar tutoriales para poner un widget o el sidebar flotante

La verdad no lo he conseguido alguien conoce un codigo con un poco de css y javascript que pueda servir para estos casos muchas gracias

sanmen1593 · 12 May 2014

¿Utilizando alguna plantilla? ¿O estás creando una propia?

kanikase · 12 May 2014

HTML:

<script>
//<![CDATA[
$(function() {
var $flotargadget = $("#ID-DEL-GADGET-A-FLOTAR"),
$window = $(window),
offset = $flotarbotones.offset();
$window.scroll(function() {
if ($window.scrollTop() > offset.top) {
$flotargadget.css({'position' : 'fixed', 'width' : '640px', 'top' : '0px'});
} else {
$flotargadget.css({'position' : 'absolute', 'top' : 'auto'});
}
});
});
//]]>
</script>
<style>
#ID-DEL-GADGET {
background:#333; /* Color de fondo del gadget */
z-index:2;
width:300px; /* Ancho del gadget */
}
</style>

Eso si lo que quieres es que flote al hacer scroll :distant:

Edwin Antonio Tapia Rebolledo · 12 May 2014

Me se un código pero no tiene el tope, es decir pasa por arriba del footer y todo eso.
Te dejo en donde lo vi, quizás ahí puedan decir, si viene me avisas.

CÃ³mo hacer que el gadget de PÃ¡ginas se haga flotante al bajar el scroll | Ciudad Blogger - Trucos y tutoriales para tu blog

anferro · 13 May 2014

en la #ID-DEL-GADGET-A-FLOTAR seria reemplazar por HTML1

enghels · 30 Abr 2015

Aquí explico como hacerlo
Como fijar o hacer flotar un widget en blogger - Enghels | El blog sin limites

Yo mismo lo probe :encouragement:

kanikase · 1 May 2015

enghels dijo:
Aquí explico como hacerlo
Como fijar o hacer flotar un widget en blogger - Enghels | El blog sin limites

Yo mismo lo probe :encouragement:

Comentas en uun post de hace casi un año XD

JesusEC · 2 May 2015

enghels dijo:
Aquí explico como hacerlo
Como fijar o hacer flotar un widget en blogger - Enghels | El blog sin limites

Yo mismo lo probe :encouragement:

Wow, si que estas buscando tráfico. Esos post, ya estaban muy olvidados jejeje

enghels · 27 Nov 2015

kanikase dijo:

HTML:

<script>
//<=!=[=C=D=A=T=A=[
$(function() {
var $flotargadget = $("#ID-DEL-GADGET-A-FLOTAR"),
$window = $(window),
offset = $flotarbotones.offset();
$window.scroll(function() {
if ($window.scrollTop() > offset.top) {
$flotargadget.css({'position' : 'fixed', 'width' : '640px', 'top' : '0px'});
} else {
$flotargadget.css({'position' : 'absolute', 'top' : 'auto'});
}
});
});
//]=]=>
</script>
<style>
#ID-DEL-GADGET {
background:#333; /* Color de fondo del gadget */
z-index:2;
width:300px; /* Ancho del gadget */
}
</style>

Eso si lo que quieres es que flote al hacer scroll :distant:

En que parte se pone ese codigo?