fixed div clone on scroll
clone <div> when reach the top of the window at scroll and make it position fixed
HTML
<div class="view view-aktualis-palyazatok view-id-aktualis_palyazatok view-display-id-page_1 view-dom-id-1">
<div class="view-header">
<a href="#">111111111111111eszközbeszerzés</a> <a href="#">humán pályázatok</a> <a href="#">ingatlanvásárlás</a> <a href="#">telephelyfejlesztés</a> <a href="#">egyéb</a> </div>
<div class="view-content">
<div class="item-list">
<ol>
<li class="views-row views-row-1 views-row-odd views-row-first"><div class="node" id="node-261">
<h2><a title="Pályázati felhívás a mikro-, kis- és középvállalkozások munkahelyteremtő beruházásainak támogatására (kód: NFA-2013-KKV)" href="#">Pályázati felhívás a mikro-, kis- és középvállalkozások munkahelyteremtő beruházásainak támogatására (kód: NFA-2013-KKV)</a></h2>
<div class="content clear-block">
<p>Új eszközbeszerzés, telephelyfejlesztés, munkahelyteremtés<br>
2013. február 14-től lehet pályázatot beadni a Nemzeti Fejlesztési Alap által kiírt támogatásra.</p>
</div>
<div class="clear-block">
<div class="meta">
</div>
</div>
</div>
</li>
<li class="views-row views-row-2 views-row-even"><div class="node" id="node-260">
<h2><a title="Mikrovállalkozások fejlesztése (kód: GOP-2011-2.1.1/M)" href="#">Mikrovállalkozások fejlesztése (kód: GOP-2011-2.1.1/M)</a></h2>
<div class="content clear-block">
<p>Eszközbeszerzés, ingatlanvásárlás, telephelyfejlesztés, informatikai fejlesztés.</p>
</div>
<div class="clear-block">
<div class="meta">
</div>
</div>
</div>
</li>
<li class="views-row views-row-3 views-row-odd"><div class="node" id="node-259">
<h2><a title="Mikro-, kis és középvállalkozások technológiafejlesztése (kód: GOP-2011-2.1.1/A, KMOP-2011-1.2.1/A)" href="#">Mikro-, kis és középvállalkozások technológiafejlesztése (kód: GOP-2011-2.1.1/A, KMOP-2011-1.2.1/A)</a></h2>
<div class="content clear-block">
<p>Klasszikus...
CSS
div, li, h2, p {
display:block;
margin:1em 0.1em;
}
.view-header {
position:relative;
}
.view-header.fixed {
position:fixed;
display:none;
top: 0px;
}
JavaScript
function divFloater(div){
var win = $(window);
var divTop = div.offset().top;
var divLeft = div.offset().left;
win.scroll(function(){
var has_fixed = div.children('div').hasClass('fixed');
var winTop = win.scrollTop();
if ((winTop > divTop) && !has_fixed){
div.clone().appendTo(div).addClass("fixed");
$('.fixed').css({'left':divLeft+'px'}).fadeIn();
} else if ((winTop <= divTop)){
$('.fixed').fadeOut();
div.children('.fixed').remove();
}
// console.log(winTop+'|'+divTop'|'+has_fixed+);
});
};
$(document).ready(function(){
var floating_div=$('.view-aktualis-palyazatok').children('.view-header');
divFloater(floating_div);
});