Ya tengo la solución.
La cosa quedaría así:
Javascript
:
Código HTML:
function muestra_div(texto){
document.getElementById('id_etiqueta_informativa').innerHTML = texto;
margen_bottom = 150;
nuevo_top = $(window).scrollTop() + ( $(window).height() - margen_bottom );
nuevo_top1 = $("#id_etiqueta_informativa").offset().top - margen_bottom;
if($(window).scrollTop()==0)
$("#id_etiqueta_informativa").css({ opacity: 1, "z-index": 999999, top: nuevo_top1 });
else
$("#id_etiqueta_informativa").css({ opacity: 1, "z-index": 999999, top: nuevo_top });
}
Lo encontré de las páginas que me habeis ido pasando. Era lo que necesitaba saber la posición del scroll y la posición de la div y hacer el cálculo este para saber donde lo posicionaba. Realizo el cálculo del top dónde tiene que mostrarse la div y lo añado en el .css. Ahora solo me faltaría unificar y optimizar un poco el código, por ejemplo ahorrarme el if.
CSS:
Código HTML:
#id_etiqueta_informativa{
background: #EEE;
border: 1px solid #CCC;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
-khtml-border-radius: 5px;
box-shadow: rgba(0,0,0,0.3) 5px 5px 10px;
font: bold 16px 'Arial';
margin: 20px;
opacity: 0;
padding: 20px;
position: absolute;
right: 0;
top: 100%;
transition: opacity 1.5s ease;
-moz-transition: opacity 1.5s ease;
-webkit-transition: opacity 1.5s ease;
-o-transition: opacity 1.5s ease;
-ms-transition: opacity 1.5s ease;
-khtml-transition: opacity 1.5s ease;
z-index: 0;
}
He cambiado "bottom" por "top" y transition "all" por "opacity". El problema era que cuando hacía la transición de todo me hacía también el movimiento y ahora solo hace la transición de la opacidad. Y lo de top: 100% solo me sirve si lo modifico desde javascript, lo cual cuando lo cambiaba no veía buenos resultados porque no lo recalculaba desde el javascript
Gracias por vuestra ayuda.
Saludos