jQuery/javascript til at flytte table head
Hej,jeg har svært ved at komme videre med nedenstående kode. Ideen er at lave et script til at flytte table heads med ned når brugeren scroller ned ad siden. Når brugeren når forbi bunden af tabellen skal table head'en springe tilbage til toppen. På siden kan der være flere table heads - og i markup'en har de alle fået klassen "movetablehead". Antallet af tabeller skrifter fra gang til gang.
Den følgende kode virker fint for første tabel - bortset fra samtlige table heads bliver flyttet op og står oven i hinanden - dog virker if-else funktionen ikke. Når man når til anden tabel sker der nemlig intet.
Jeg håber nogen kan hjælpe, da jeg har set mig blind på problemet.
Her er det nuværende script
<script type="text/javascript">
$(function() {
var name = ".movetablehead";
var table = "table";
var firstOffset = $(name).offset();
$(window).scroll(function () {
jQuery.each(name, function() {
if ($(document).scrollTop()>firstOffset.top && $(document).scrollTop()<firstOffset.top+$(table).height()) {
var offset = (($(document).scrollTop())*1)+"px";
$(".movetablehead").css({
'position': 'absolute',
'top': offset
});
}
else {
$(name).css({ position: 'static' });
};
});
});
});
</script>