http://starodaj.eu
obecnie robiłem to w taki sposób
Link do źródła JS
Jednak od razu widać, że większość kodu powtarza się. Dlatego chciałbym zrobić jedną funkcję, która na podstawie ID kliknietej pozycji, wykona odpowiednie przesuniecia i nadanie klas.
Mam jednak problem "jak to zapisać?"i czy "tak jest dobrze"?
Mój mały algorytm:
1. Po klikniecu w #primary-nav li a - usun wsyztskie klasy active z #primary-nav li a - usun wsyztskie klasy active z #menu-subs div - nadaj active na biezacy element - nadaj active na element menu-sub + id - przesun content o id*1042px - przypisz do height odpowienia wartosc swithcem i ustaw taka wysokosc #bg 2. po kliknieciu w h1 a - nadaj klasy active na wszytskie #primary-nav li a - usun wsyztskie klasy active z #menu-subs div - przesun content do left=0px
a oto mój pseudo kod:
1.
$(document).ready(){ $("#primary-nav li a").click(function(){ var id= parseInt($(this).attr('id')); $(this).removeClass("active"); }); $(this).removeClass("active"); }); ${this}.addClass("acive"); $("menu-sub" + id).addClass("active"); $("div#content-inside").animate({left:-1*(id*1042px)},500); var SetHeight = '1'; switch(id) { case 1: setHeight = '100%'; break; case 2: setHeight = '300px'; break; default: setHeight = '300px'; } $("div#bg").animate({height:setHeight}, 500); }; }
2.
$(document).ready(){ $("h1 a").click(function(){ $(this).addeClass("active"); }); $(this).removeClass("active"); }); $("div#content-inside").animate({left:'0px')},500); $("div#bg").animate({height:'100%'}, 500); }; }