Nawigacja
jQuery i PF v7 w jednym stali domu... cz.3
Napisane przez Wooya dnia 22 października 2009 22:47 · 0 komentarzy · 9308 czytań · · ·
Streszczenie:
Czyli jak wymusić na użytkownikach używania JavaScript (w końcu bez tego jQuery nam nie zadziała). Dwa sposoby: wredny sposób nie wymagający modyfikacji skórek (jednak niezgodny z W3C) oraz oparty na CSS, wymagający modyfikacji skórek, ale zgodny z W3C.Zacznijmy od owego "wrednego" wymuszania włączenia obsługi JS w przeglądarce. Posłużymy się tutaj Output Handlingiem znanego z PF v7. Jak zwykle tworzymy nowy panel, wklejamy poniższy kod, zapisujemy go i włączamy:
add_to_head("<noscript><meta http-equiv='refresh' content='0,URL='js.html' /></noscript>");
Gwoli wyjaśnienia. W przypadku braku obsługi JS, PF przekieruje użytkownika na stronę http://mojadomena.pl/js.html. Zrozumiałe chyba, że musimy ową stronę z odpowiednim komunikatem utworzyć :) Od tej chwili, użytkownicy nie posiadający włączonej obsługi JS zobaczą ową utworzoną przez nas wcześniej stronę. Ja stosując tą metodę w różnych swoich projektach załączam mniej więcej taki komunikat:
Przepraszamy, ale Twoja przeglądarka nie posiada włączonej, lub nie obsługuje JavaScript.
Niniejsza strona wymaga obsługi JavaScript do poprawnej pracy.
Jeżeli już włączyłeś obsługę JavaScript, kliknij <a href='index.php'>TUTAJ</a>, aby ponownie przejść do strony głównej.
A teraz sposób zgodny z W3C. Część skórek opartych na divach z PF v7 (o ile nie wszystkie) posiada nadrzędnego diva:
<div id='container'>[ZAWARTOŚĆ STRONY]</div>
Aby użytkownikom wymusić korzystanie z JS należy dodać:
1) W pliku styles.css danej skórki zmodyfikować/dodać do klasy #container:
display:none;
czyli np. w przypadku braku definicji dla tego ID dodać taki wpis:
#container { display:none; }
2) Za znakiem zamykającym tego diva dodać kolejnego diva z przykładową treścią:
<div id='js'> Przepraszamy, ale Twoja przeglądarka nie posiada włączonej, lub nie obsługuje JavaScript.
Niniejsza strona wymaga obsługi JavaScript do poprawnej pracy.
Jeżeli już włączyłeś obsługę JavaScript, kliknij <a href='index.php'>TUTAJ</a>, aby ponownie przejść do strony głównej. </div>
Następnie tworzymy nowy panel itd.:
add_to_head(" <script type='text/javascript'> $(function(){ $("#js").css("display","none"); $("#container").css("display","block"); }); <script> ");
W przypadku braku obsługi JS użytkownik zobaczy informację o wymaganej obsłudze JS, w innym wypadku treść strony.
To na tyle jeśli chodzi o sprawdzanie obsługi JS.
W następnym odcinku... Jeszcze się okaże ;)
Komentarze
Brak komentarzy. Może czas dodać swój?
Dodaj komentarz
Zaloguj się, aby móc dodać komentarz.
Oceny
Tylko zarejestrowani użytkownicy mogą oceniać zawartość strony
Zaloguj się lub zarejestruj, żeby móc zagłosować.
Zaloguj się lub zarejestruj, żeby móc zagłosować.
Świetne! | 50% | [1 głos] | |
Bardzo dobre | 50% | [1 głos] | |
Dobre | 0% | [0 głosów] | |
Średnie | 0% | [0 głosów] | |
Słabe | 0% | [0 głosów] |