Zbudowałem stronę, której nawigacja oparta jest na skrypcie Ajax pozwalającym wczytywać zawartość podstron do div.
Wszystko działa super, pojawia się jednak jeden problem. Skrypt działa dopiero po pełnym załadowaniu strony. Jeśli ktoś kliknie w link menu przed jej pełnym załadowaniem (jest na niej kilka elementów flash więc nie wczytuje się błyskawicznie), skrypt nie zadziała.
Chciałbym np. opóźnić wyświetlenie menu do czasu aż cała strona się załaduje, albo zrobić tak, żeby linki były aktywne dopiero wtedy.
Ma ktoś na to jakiś pomysł?
W JavaScript to może onload ale w Javie to hmmmm....
nałóż jakiegos spinnera na menu i w 'onload' go zdejmij 
Cytat(Lion_87 @ 9.12.2010, 21:29:18 ) 
W JavaScript to może onload ale w Javie to hmmmm....
Przepraszam, źle oznaczyłem przy zakładaniu tematu, już poprawiłem na JavaScript
Cytat(hondek @ 9.12.2010, 21:49:11 )
nałóż jakiegos spinnera na menu i w 'onload' go zdejmij
No wydaje mi się, że tak by było dobrze, mógłbyś mi podrzucić jakiś link, bo raczej z JS to u mnie kiepsko, jeśli już muszę, to korzystam z jakiś gotowych rozwiązań i ew. delikatnie je modyfikuję, jeśli dam radę.
Możesz w css ustawić atrybuty disabled, hidden etc., a potem np. jQuery czy czystym JS je zdjąć.
W jQ to będzie coś w stylu:
links - przykładowa klasa tych przycisków.
W jQ to będzie coś w stylu:
Kod
links.removeAttr("disabled");
links - przykładowa klasa tych przycisków.
Próbowałem np. tak:
a div wyglądał:
<div id="menu" class="klasa1">...</div>
ale klasa jest usuwana jeszcze w trakcie ładowania strony.
Jeśli dałbym:
to w ogóle nie działa.
Tutaj mnie martwi jeszcze to, że w przypadku, gdy ktoś będzie miał wyłączoną obsługę JS to nigdy tego menu nie zobaczy.
A może dałoby się coś zrobić z funkcją, któa wywołuje akcje - tą któa nie działa przed pełnym załadowaniem strony. Nie wiem czy na przykład zamienienie tutaj window.onload na coś innego dałoby skutek?:
Oczywiście oprócz tego krótkiego skryptu cała funkcja ma jeszcze kilka innych plikó, więc nei wiem czy tak sie da?
Kod
<script type="text/javascript">
$(document).ready(function() {
$('div').removeAttr('class');
});
</script>
$(document).ready(function() {
$('div').removeAttr('class');
});
</script>
a div wyglądał:
<div id="menu" class="klasa1">...</div>
ale klasa jest usuwana jeszcze w trakcie ładowania strony.
Jeśli dałbym:
Kod
<script type="text/javascript">
window.onload = function() {
$('div').removeAttr('class');
}
</script>
window.onload = function() {
$('div').removeAttr('class');
}
</script>
to w ogóle nie działa.
Tutaj mnie martwi jeszcze to, że w przypadku, gdy ktoś będzie miał wyłączoną obsługę JS to nigdy tego menu nie zobaczy.
A może dałoby się coś zrobić z funkcją, któa wywołuje akcje - tą któa nie działa przed pełnym załadowaniem strony. Nie wiem czy na przykład zamienienie tutaj window.onload na coś innego dałoby skutek?:
Kod
<script type="text/javascript">
window.onload = function(){
var refreshed_content = Array('!content');
bda.transitionAlpha = false;
bda.calculateText = "Wczytywanie strony...";
bda.loadText = "Wczytywanie strony...";
bda.errorText = "Niestety wystąpił błąd.";
bda.externalLocation = "Niestety, nie można załadować zawartości zewnętrznej strony";
bda.historyCurrentLocation;
bda.denyURLRules.push('url.contains("mailto")');
bda.imageLoadTimeout = 2;
bda.imagesNotLoadedText = " ";
bda.start(refreshed_content); // initiate the script
}
</script>
window.onload = function(){
var refreshed_content = Array('!content');
bda.transitionAlpha = false;
bda.calculateText = "Wczytywanie strony...";
bda.loadText = "Wczytywanie strony...";
bda.errorText = "Niestety wystąpił błąd.";
bda.externalLocation = "Niestety, nie można załadować zawartości zewnętrznej strony";
bda.historyCurrentLocation;
bda.denyURLRules.push('url.contains("mailto")');
bda.imageLoadTimeout = 2;
bda.imagesNotLoadedText = " ";
bda.start(refreshed_content); // initiate the script
}
</script>
Oczywiście oprócz tego krótkiego skryptu cała funkcja ma jeszcze kilka innych plikó, więc nei wiem czy tak sie da?
Kod
$('div.klasa1').removeAttr('disabled');
W nawiasie wpisujesz odwołania analogiczne do css (div znaczy wszyskie divy, kropka klasy, # id itd.).
Bez JS menu będzie nieaktywne i dobrze bo skoro korzystasz potem z Ajaxa to i tak by nic nie zobaczył.
Dodaj odpowiednią adnotacje na czerwono gdy ktoś ma wyłączony JS.
Cytat(markonix @ 10.12.2010, 12:18:56 )
Kod
$('div.klasa1').removeAttr('disabled');
Bez JS menu będzie nieaktywne i dobrze bo skoro korzystasz potem z Ajaxa to i tak by nic nie zobaczył.
Dzięki za podpowiedź, ale co do powyższego to właśnie nie do końca, bo jeśli ktoś ma wyłączony JS, to skrypt na mojej stronie nie zadziała, ale nawigacja będzie możliwa awaryjnie przez zwyczajne otwieranie linków a href, tyle, że nie będzie to do końca wygodne.
No, chyba mi się udało zrobić to co chciałem:
Kod
$(document).ready(function() {
$("#menu, #footer_left").attr('style', 'visibility: hidden;');
});
$(window).load(function() {
$("#menu, #footer_left").removeAttr("style");
});
</script>
$("#menu, #footer_left").attr('style', 'visibility: hidden;');
});
$(window).load(function() {
$("#menu, #footer_left").removeAttr("style");
});
</script>
W każdym razie działa, jak oceniacie poprawność tego?
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.