[JavaScript][CSS][PHP]jak wykryc, ze przegladarka nie obsluzy jQuery? Opcje

[dyziak]

Witam,

Tworzę stronę, której głównymi składnikami są 2 elementy jQuery. Jednak znając realia zdaję sobie sprawę, że takie rozwiązanie nie zawsze i nie na każdej przeglądarce zadziała. jQuery przewija zdjęcia - takie dwa bajery zastosowałem. I wiem, że np ie7 czasami pyta o aplet activeX zanim cos uruchomi - wówczas strona jest w rozsypce...

Dlatego tez chciałbym wprowadzić do kodu zabezpieczenia na zasadzie if ----w domyśle obsługa jQuery .... else zastąp grafika statyczna
Miałoby to służyć zastąpieniu diva z jQuery divem z jakimś statycznym rozwiązaniem.


Reasumując, mój problem polega na tym, że nie wiem jak sprawdzić, czy obiekt jQuery nie zostanie obsłużony ... I słowo harcerza - a ognisko rozpalić tak jakby umiem - ze wódkę postawie każdemu dobremu człowiekowi, który uratuje mi tyłek :- )

Pozdrawiam

Piotrek

[CuteOne]

jquery to javascript - sprawdz czy przegladarka go obsluguje

[dyziak]

w jaki sposób?

[Crozin]

To się robi nieco inaczej. Słowo-klucz to "nieinwazyjny JavaScript", czyli:

1. Robisz stronę tak jakby była używana bez obsługi JavaScriptu w przeglądarce.
2. Dodajesz skrypt JS, który "przejmuje kontrolę", tj. zmienia coś na stronie.

W efekcie jeżeli nie ma obsługi JS to punkt drugi nie zostanie w ogóle wykonany, ale pierwszy wykona się zawsze. Przykładowo:

[HTML] pobierz, plaintext 
<ul id="events-list">
  <li>
    <h2>Jakiś nagłówek</h2>
    <div class="body"><p>Jakaś treść</p></div>
  </li>
  <li>
    <h2>Jakiś nagłówek</h2>
    <div class="body"><p>Jakaś treść</p></div>
  </li>
  <li>
    <h2>Jakiś nagłówek</h2>
    <div class="body"><p>Jakaś treść</p></div>
  </li>
  <li>
    <h2>Jakiś nagłówek</h2>
    <div class="body"><p>Jakaś treść</p></div>
  </li>
  <li>
    <h2>Jakiś nagłówek</h2>
    <div class="body"><p>Jakaś treść</p></div>
  </li>
</ul>
[HTML] pobierz, plaintext 

[JAVASCRIPT] pobierz, plaintext 
jQuery(function($) {
  $("#events-list li:not(:first-child)").addClass("clickable").each(function() {
    $("h2", this).toggle(function() {
      $(this).next().hide();
    }, function() {
      $(this).next().show();
    }).click();
  });
});
[JAVASCRIPT] pobierz, plaintext 

[ixpack]

O tak:


Dodajesz js (rozumiem, że wiesz gdzie...):

[HTML] pobierz, plaintext 
$("#test").css({'display' : 'block'});
[HTML] pobierz, plaintext 

i teraz div z galerką ma jakiś id - np. "test" - stylujesz div w ten sposób:

[HTML] pobierz, plaintext 
<div id="test" style="display:none;">
[HTML] pobierz, plaintext 

Następna rzecz to dodanie kolejnego div'a - już z grafiką bez js/jquery pomiędzy "<noscript> o tu </noscript>"

Ten post edytował ixpack 19.03.2011, 21:36:16