Kategorien

Archiv

  • [-]2010(15)
    • [-]November(1)
    • [-]Oktober(1)
    • [-]Juli(2)
    • [-]Juni(9)
    • [-]Mai(2)

Zur Zeit wird gefiltert nach: jQuery
Filter zurücksetzen

jQuery
29.07.2010
09:31

DIV verlinken

JQuery Script um ein DIV-Element zu verlinken. Es wird das ganze Element mit einem link der im Element liegt verlinkt.

Quelltext:  Alles auswählen  |  Zeilennummerierung an/aus
  1. jQuery(document).ready(function(){
  2.     jQuery(".klassevomcontainer").click(function(){
  3.         window.location=jQuery(this).find("a").attr("href");
  4.         return false;
  5.     });
  6. });
Abteilung für Gestaltung GmbH(kontakt@abteilung.ch)weiterleitenPermalinkKommentare 0Gravatar: Abteilung für Gestaltung GmbH
Views: 570
HTML/jQuery
02.06.2010
21:54

jQuery & Navigation: Aktiven Menüpunkt mit einer Klasse versehen

Mit jQuery lässt sich der aktive Zustand eines Menüeintrages einfach anpassen. Die Funktion entfernt vorher aktivierte Einträge und markiert den angeklickten Punkt als aktiv.

Quelltext:  Alles auswählen  |  Zeilennummerierung an/aus
  1. jQuery('#navigation a').click(function () {
  2.     jQuery('#navigation a').removeClass('selected');
  3.     jQuery(this).addClass('selected');
  4. });
Abteilung für Gestaltung GmbH(kontakt@abteilung.ch)weiterleitenPermalinkKommentare 0Gravatar: Abteilung für Gestaltung GmbH
Views: 540
jQuery
02.06.2010
21:52

jQuery-Tooltip mit voller Kontrolle über den Code

jQuery-Tooltips ohne viel Ballast, dafür einfach kontrollierbar.

Quelltext:  Alles auswählen  |  Zeilennummerierung an/aus
  1. jQuery(document).ready(function ()
  2. {
  3.   tooltip();
  4. });
  5.  
  6. function tooltip()
  7. {
  8.   jQuery("img.tooltip").mouseover(    
  9.     function (event)
  10.     {
  11.       var text = this.alt;
  12.  
  13.       // X- und Y-Koordinaten des Cursor ermitteln
  14.       x = event.pageX+10;
  15.       y = event.pageY+10;
  16.  
  17.       / ein DIV für den Tooltip erstellen
  18.       jQuery("body").append("<div id='tooltip'>"+text+"</div>");
  19.  
  20.       // das erstellte DIV mit CSS positionieren
  21.       jQuery("#tooltip").css("left", x).css("top", y);
  22.     }
  23.   );
  24.  
  25.   jQuery("img.tooltip").mouseout(
  26.     function (event)
  27.     {
  28.       // das DIV beim verlassen des Events entfernen
  29.       jQuery("#tooltip").remove();
  30.     }
  31.   );
  32. }
Abteilung für Gestaltung GmbH(kontakt@abteilung.ch)weiterleitenPermalinkKommentare 0Gravatar: Abteilung für Gestaltung GmbH
Views: 588
jQuery
02.06.2010
21:38

Kein Script-Konflikt mit jQuery

Wenn man sicherstellen möchte, dass jQuery nicht mit andern JavaScript-Libraries in Konflikt gerät, kann man dies ganz einfach durch die noConfict()-Funktion erledigen.

Im nachfolgenden Code wird dann einfach das $-Zeichen durch den Term "jQuery" ersetzt.

Quelltext:  Alles auswählen  |  Zeilennummerierung an/aus
  1. // Hier stellen wir jQuery so ein, dass es nicht mit andern Skript interferiert
  2. jQuery.noConflict();
Abteilung für Gestaltung GmbH(kontakt@abteilung.ch)weiterleitenPermalinkKommentare 0Gravatar: Abteilung für Gestaltung GmbH
Views: 579
« Februar 2012»
S M T W T F S
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29