jQuery: Nur einen Bereich eines divs klickbar machen

Manchmal möchte man einfache Lösungen haben. Da soll kurzzeitig mal ein Teil des Templates für eine Aktion klickbar gemacht werden. Problem: Um Fehlklicks zu vermeiden darf nur ein bestimmter Teil eines divs ohne Änderungen am Quellcode klickbar gemacht werden.

Mit jQuery nur einen Bereich eines div klickbar machen

jQuery offset

In diesem fall heißt die Lösung jQuery offset():

jQuery(document).ready(function() {
  jQuery('#myID').click(function (event) {
    if (event.pageX > jQuery(this).offset().left + X) {
	alert('Das ist ein Klick');
    }
  });	
});

Wobei X der Offset vom linken Rand des divs mit der ID „myID“ ist.

Bereich weiter eingrenzen

jQuery-part-of-a-div-clickable-2

jQuery(document).ready(function() {
  jQuery('#myID').click(function (event) {
    if ((event.pageX > jQuery(this).offset().left + X) && (event.pageY > jQuery(this).offset().top + Y)) {
	alert('Das ist ein Klick');
    }
  });	
});

Wobei X der Offset vom linken Rand und Y der Offset vom oberen Rand des divs mit der ID „myID“ ist.

Vielen Dank an dieser Stelle an dystroy

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.