Catch404

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.