Autor Zpráva
czmarci
Profil *
Zdravím Vás, řeším tu celou noc problém s JQUERY & AJAXEM. Dopředu říkám, že jsem začátečník a budu všem vděčný za pomoc.

Popis: po kliknutí na odkaz s třídou ajax má box ve kterém je obsah odjet doleva kde se ztratí pod sidebarem, skript má načíst nový obsah přes AJAX a box má po-té opět vyjet, ale už s novým obsahem. Vše funguje jak má až na samotnou animaci toho zajíždění/vyjíždění, která není plynulá, spíše se trhá (seká - nevím jak to vyjádřit jedním slovem). Zkoušel jsem toho už hodně ale pořád se nemohu dobrat k uspokojivému výsledku. Bohužel nemohu přidat live ukázku stránky, protože běží na RS na localhostu.

Vše je samozřejmě uzavřeno v $(document).ready(function() {, zkoušel jsem i přidat před animate stop(), ale také bez efektu.

$("a.ajax").live("click", function(e){  
                        var link = $(this).attr("href");                        
                        $("#sidebar").load(link + " #sidebar > *"); // Aktualizuje sidebar
                        $("#menu").load(link + " #menu > *");  // Aktualizuje hlavní menu                        
                        $("#slide").animate({ marginLeft: parseInt($("#slide").css('marginLeft'),10) == 0 ? -$("#slide").outerWidth() : 0 }, 1500, function(){
                                    window.history.pushState('Object', 'Title', link);
                                    window.history.replaceState('Object', 'Title', link);
                                    $("#slide").load(link  + " #slide  > *", function() {
                                                $("#slide").animate({ marginLeft: parseInt($("#slide").css('marginLeft'),10) == 0 ? -$("#slide").outerWidth() : 0 }, 1500);                                                                        
                                    });
                        });
                        e.preventDefault();
});

To samé se stane po kliknutí na toggle tlačítko, obsah má zajet pod sidebar a má koukat pouze tlačítko pro opětovné vysunutí obsahu. To také funguje správně až na animaci. Opět se to trhá.

$("a#toggle").live("click", function() {
                       var $marginLefty = $('#box');
                       $marginLefty.animate({ marginLeft: parseInt($marginLefty.css('marginLeft'),10) == 0 ? -$marginLefty.outerWidth() : 0 }, 'slow');
});



Tak jsem nakonec rozběhal i živou ukázku na http://netbrana.eu/demo/designovedomy.cz/. Po kliknutí např. na stránku katalog projektů je vidět, kvůli čemu si celou noc trhám vlasy :D
_es
Profil
czmarci:
skript má načíst nový obsah přes AJAX a box má po-té opět vyjet, ale už s novým obsahem.
Aký to má zmysel - to ide o nejako divoko, dynamicky sa meniaci obsah? Nestačí skrývať a zobrazovať už načítaný obsah?

Časť adresy za # sa neodosiela na server, teda sa pokúšaš celý dokument http://netbrana.eu/demo/designovedomy.cz/katalog-projektu/ cez JS „vopchať“ do toho istého dokumentu a nastáva akási podivná rekurzia.
czmarci
Profil *
Skrývat a zobrazit načtený obsah možné není, jedná se o šablonu pro redakční systém a na celém webu bude více jak 100 odkazů. Cílem celé funkce je, aby po kliknutí na odkaz skript nahradil stávající obsah novým a to bez přesměrování. Ono to má své opodstatnění v dalších funkcích.

Nesnažím se nacpat celý dokument ze zmíněné adresy sama do sebe, po kliknutí se načtou pouze části nového dokumentu, které nahradí původní ale reálně nedojde k přesměrování na novou stránku. I když v menu kliknete na odkaz, zůstanete stále např. na úvodní stránce, jen se menu, sidebar a obsah nahradí ajaxem z cílového odkazu. URL se prohlížeči jen podstrčí.

To vše funguje, jen ta animace se trhá. Pokud vyhodím celé dynamické načítání obsahu a nechám tam pouze ikonu pro zajíždění panelu z obsahem, stejně se animace po kliknutí trhá. To zajíždění panelu je klíčové pro fotogalerii.
_es
Profil
czmarci:
Nesnažím se nacpat celý dokument ze zmíněné adresy sama do sebe
Medzi http://netbrana.eu/demo/designovedomy.cz/ a http://netbrana.eu/demo/designovedomy.cz/katalog-projektu/ nevidím skoro žiadny rozdiel. Ako by mala jQuery metóda load „zapracovať“ do divu všetky tie externé štýly, JS súbory a iné časti z head elementu?

jedná se o šablonu...
Výhovorka, sprav to nejako normálne.

$("#sidebar").load(link + " #sidebar > *"); // Aktualizuje sidebar
Pokúšaš sa načítať adresu "http://netbrana.eu/demo/designovedomy.cz/katalog-projektu/ #sidebar > *" - je nekorektná, prehliadač odošle požiadavku na http://netbrana.eu/demo/designovedomy.cz/katalog-projektu/.
czmarci
Profil *
1) Já do toho netahám celý dokument ale pouze jeho fragmenty (viz. bod 3)
2) ...
3) http://api.jquery.com/load/#loading-page-fragments

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: