Zitat von
melzebub
Habe die Lösung dazu mal ins Wiki geschrieben.
Genau daran hänge ich jetzt, da ich mich wahrscheinlich mit Javascript nicht gut genug auskenne. Ich habe erst den Code aus dem Wiki Artikel genommen, und dann den direkt von deiner Webseite (siehe nachfolgenden Code). In dem Code habe ich nur die Klassen geändert, die bei mir "mod_customnav" und "container" heißen.
Wie Ihr seht auf http://2013.das6040.de/ legt sich beim Scrollen der "container" über den "mod_customnav". Wie kann ich das verhindern?
Code:
window.addEvent('domready',function(){
/*navi*/
var navi = $('navi');
var container = $('container');
var arbeiten = $('arbeiten');
var profil = $('profil');
var windowcoords = $(window).getCoordinates();
var navicoords = navi.getCoordinates();
var containercoords = container.getCoordinates();
var arbeitencoords = arbeiten.getCoordinates();
var profilcoords = profil.getCoordinates();
//std.
$$('li.container a').addClass('button');
window.addEvent('scroll',function(){
var scroll = this.getScroll();
//navidocking
if((scroll.y) > navicoords.top)
{
var navpos = navi.addClass('mod_customnav');
container.set('style','margin-top:'+navicoords.height+'px');
//anti ios :)
$$('.ios #container').set('style','margin-top:0');
}
else
{
var navpos = navi.removeClass('mod_customnav');
container.set('style','margin-top:0');
}
//check position for matching with active status
if((scroll.y + -navicoords.height+120) > containercoords.top)
{
$$('#navi a.button').removeClass('button');
$$('li.arbeiten a').addClass('button');
}
else
{
$$('#navi a.button').removeClass('button');
$$('li.container a').addClass('button');
}
if ((scroll.y+windowcoords.height-120) > profilcoords.top)
{
$$('#navi a.button').removeClass('button');
$$('li.profil a').addClass('button');
}
});
var mySmoothScroll = new Fx.SmoothScroll({
links: 'a',
wheelStops: false,
offset: {
x: 0,
y: -navicoords.height
}
});
})