| Autor | Zpráva | ||
|---|---|---|---|
| czmarci Profil * |
#1 · Zasláno: 17. 4. 2012, 06:37:49 · Upravil/a: czmarci
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 |
#2 · Zasláno: 17. 4. 2012, 07:26:36
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 * |
#3 · Zasláno: 17. 4. 2012, 08:03:08
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 * |
#5 · Zasláno: 17. 4. 2012, 08:34:51
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 |
||
|
Časová prodleva: 12 let
|
|||
0