mam problem z pływającym menu. Postaram się wytłumaczyć to jakoś logicznie i w skrócie:
Strona składa się z div'ów "top" i "middle". W divie "top" mamy jakieś tam elementy i przyjmijmy, że jego wysokość to 500px, a w divie "middle" o wysokości "auto" mamy jakieś tam elementy a dodatkowe nasze "floating menu". Zrobione są kotwice do diva "middle" więc całe plywające menu od razu pokazuje się w "middle" omijając całego diva "top". Problem pojawia się kiedy chcemy wrócic uzywając suwaka do DIV'a "top" ponieważ całe plywające menu nakłada nam się na "topa" kiedy przesywamy suwak do góry. Jak zrobić by pływające menu znikało po przekroczeniu górnej granicy "middle"
Poniżej wklejam kody HTML, CSS i JS
HTML:
Cytat
<div id="floatMenu">
<ul>
<a href=""><h3>Audyty</h3></a>
<a href=""><h3>Certyfikaty</h3></a>
<a href=""><h3>Kamera</h3></a>
<a href=""><h3>Oferta</h3></a>
<a href=""><h3>Zapytanie</h3></a>
</ul>
</div>
<ul>
<a href=""><h3>Audyty</h3></a>
<a href=""><h3>Certyfikaty</h3></a>
<a href=""><h3>Kamera</h3></a>
<a href=""><h3>Oferta</h3></a>
<a href=""><h3>Zapytanie</h3></a>
</ul>
</div>
CSS
Cytat
#floatMenu {
position:absolute;
padding-top:0px;
bottom:30px;
top:0px;
margin-left:0px;
min-height:300px;
width:200px;
}
position:absolute;
padding-top:0px;
bottom:30px;
top:0px;
margin-left:0px;
min-height:300px;
width:200px;
}
JS
Cytat
var name = "#floatMenu";
var menuYloc = null;
$(document).ready(function(){
menuYloc = parseInt($(name).css("top").substring(0,$(name).css("top").indexOf("px")))
$(window).scroll(function () {
var offset = menuYloc+$(document).scrollTop()+"px";
$(name).animate({top:offset},{duration:500,queue:false});
var menuYloc = null;
$(document).ready(function(){
menuYloc = parseInt($(name).css("top").substring(0,$(name).css("top").indexOf("px")))
$(window).scroll(function () {
var offset = menuYloc+$(document).scrollTop()+"px";
$(name).animate({top:offset},{duration:500,queue:false});