
Catch404
Link ellenőrzés jQuery-vel
Verzió: | 1.01 |
Kiadás dátuma: | 2010/07/06 |
Fejlesztő: | Addy Osmani |
Liszensz: | GPL |
Bevezető
"Normális" esetben, ha egy link nem létező oldalra mutat, azt csak azután tudjuk meg, miután ráklikkeltünk a hivatkozásra. Ez a háttérben úgy zajlik, hogy a szerver megpróbálja megtalálni a kért tartalmat, és ha nem találja, akkor a 404-as oldalt adja vissza eredményül. Ezután pedig szomorúan (esetleg bosszúsan) kattintgathatunk a "vissza" gombra, hogy visszakerüljünk a még működő tartalomhoz.
A Catch404 segít nekünk abban, hogy a felhasználó viszonylag "emészthető" formában értesüljön arról, hogy a kívánt hivatkozás nem működik. Azoknál a linkeknél, amelyekhez hozzárendeljük, a plugin (a link-re klikkelve) egy ellenőrzést hajt végre, és ha 404-es oldalt kap eredményül, akkor lehetőség van azt egyénileg lekezelni: egy modális ablakban tetszőleges tartalmat jeleníthetünk meg a pórul járt felhasználónak (és mindezt úgy, hogy nem kellett az oldalt elhagyni - ágyő "vissza" gomb! :) ).
Implementálás
CSS
A modális ablak formázásáért felelős CSS:
<link type="text/css" rel="stylesheet" href="popup.css"/>
JavaScript
<script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/catch404.min.js"></script>
Deklaráció
A deklarációban megadhatjuk, mely osztályhoz (esetleg osztályokhoz) akarjuk rendelni a plugin-t:
$(document).ready(function() { $('.ajaxcheck').catch404(); });
Használat
HTML szintjén a használat már egyértelmű: a kívánt link-ekhez csak a deklarációban használt CSS osztályt kell hozzárendelni:
<a class="ajaxcheck" href="egy-link.html">Link szövege</a>
Azonban ne feledkezzünk meg a modális ablakról. Ehhez #404message azonosítóval egy div blokkot kell létrehoznunk, amelyben tetszőleges tartalmat adhatunk a figyelmeztető ablakunknak.
Tippek
- Ha a js file-ba belemászunk, a plugin üzeneteit "magyarosíthatjuk".
- A modális ablak több paraméterét is szintén a forrás file-ban tudjuk csak felülbírálni.
- Fontos még megemlíteni, hogy szintén a js-be van "égetve", hogy egy bezárás gombot (képként) elhelyez a tartalomban. Amennyiben a modális ablak kinézetét saját ízlésünkre szeretnénk formálni, nagy valószínűséggel a js-turkászás elkerülhetetlen.