Próbuję utworzyć menu Na wzór tego http://www.ufcgym.com tyle, że w Jqery. I nie za bardzo wiem jak z animować ruch ciężarków. Próbowałem w następujący sposób
CODE
$(document).ready(function(){
$("#contener1").animate({marginTop: "+=41"}, {duration: 1})
$("li").click(function(){
$(this).animate({ marginTop: "-=41"}, {
duration: 'slow'})
$(this).animate({marginTop: "+=41"}, {
duration: 'slow'})
});
$("#contener1").animate({marginTop: "+=41"}, {duration: 1})
$("li").click(function(){
$(this).animate({ marginTop: "-=41"}, {
duration: 'slow'})
$(this).animate({marginTop: "+=41"}, {
duration: 'slow'})
});
i odpowiedni css do tego.
efekt niestety jest mizerny ponieważ margines jest animowany od góry do dołu a nie od dołu do góry :/ .
Próbowałem także w taki sposób
CODE
$(document).ready(function(){
$("li").click(function(){
$(this).animate({ Top: "-=41"}, {
duration: 'slow'})
$(this).animate({Top: "+=41"}, {
duration: 'slow'})
});
$("li").click(function(){
$(this).animate({ Top: "-=41"}, {
duration: 'slow'})
$(this).animate({Top: "+=41"}, {
duration: 'slow'})
});
Niestety w tym wypadku prawidłowo jest animowana tylko jedna linia i nie wiem jak sprawić by animowane były tez linie powyżej.
Bardzo proszę o pomoc nie oczekuję gotowych rozwiązań wystarczy jak ktoś troszkę mnie nakieruje.
A zabawę z JQery dopiero zaczynam