Einfache Dropdown-Navigation mit CSS und JavaScript

Ein typisches Aufklappmenü, umgesetzt mit reinem CSS. Internet Explorer bis Version 7 benötigt etwas Hilfe per JavaScript. Dazu habe ich die jQuery- Bibliothek eingesetzt (was zwar etwas übertrieben erscheint, ich jedoch meistens sowieso auf der Website einsetze). Getestet mit IE 6-8, Firefox 3x und Google Chrome auf PC. <!DOCTYPE html> <html lang=“en“> <head> <meta charset=“utf-8″ […]

Onepager mit jQuery

jQuery-Script um auf kleinen Webseiten (Web-Visitenkarten bzw. Onepager) zu navigieren. Inhalte werden ein- und ausgeblendet, ähnlich Accordion-Scripts. Einzelne Inhalte können aber auch über den Hash-Verweis direkt angesprungen werden, z.B. unckel.com/#kontakt. Ist kein JavaScript verfügbar, werden alle Inhalte untereinander dargestellt. Über die Navigation können diese angesprungen werden. JavaScript <script src=“http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js“></script> <script> $(function() { var navLinks = […]

jQuery: HTML ID-Attribute hinzufügen

Gegeben sind HTML-Elemente welche alle die Klasse ‚box‘ zugewiesen wurde. Will man nun gezielt z.B. das 3. Element ansprechen, ginge das auch mit ‚ $(„.box“).eq(2)‘. Mit folgendem Code-Schnipsel füge ich jedoch jedem div-Element mit der Klasse ‚box‘ ein id-Attribut mit aufsteigender Zählung an (‚box1‘, ‚box2‘,…). $(„.box“).each(function(index) { var boxId = „box“ + index; $(this).attr(„id“, boxId); […]

Einfacher Spamschutz für E-Mail-Adressen

Einfacher aber effektiver Spamschutz für E-Mail-Adressen mit Javascript und jQuery. Ist JavaScript deaktiviert, erscheint nur info [at] domain.com. <script type=“text/javascript“ src=“jquery.js“></script> <script type=“text/javascript“> $(function(){ $(‚.email‘).each(function(index) { var s = $(this).text().replace(“ [at] „, „&#64;“); $(this).html(„<a href=\“mailto:“ + s + „\“>“ + s + „</a>“); }); }); </script> Aus: info [at] domain.com wird: info@domain.com Im Quelltext die E-Mail-Adressen in span-Tags mit […]