michael trenkler eBuisness Solutions
Humboldtstraße 1
79098 Freiburg
info@mtcd.de | |
Telefon | +49 761 453 89 72 |
Mobil | +49 151 234 34 080 |
Es gibt so ein paar Dinge, die mir an jQuery fehlen. Und für die es nicht zwangsläufig ein Plugin braucht.
Beispielsweise eine Funktion zum Zentrieren eines Elementes auf der Seite.
Für diese Aufgabe existieren (wie immer) mehrere Lösungsansätze, folgender funktioniert sehr gut für mich:
<button id="triggerExample">Beispiel zentriert anzeigen</button><div id="exampleDiv"> Dieses Beispiel ist mit jQuery center() zentriert<br/><button id="close">Schliessen</button></div><style> button#triggerExample {} div#exampleDiv {display:none;box-shadow:2px 2px 2px #aaa;width:400px;height:200px;padding:20px 10px;border:1px solid #aaa;background:white} div#exampleDiv button.close {} </style><script> jQuery('document').ready(function(){ jQuery.fn.center = function () { this.css("position","absolute"); this.css("top", (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop() + "px"); this.css("left", (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px"); return this; } jQuery('button#triggerExample').click(function(){ jQuery('div#exampleDiv').show(); jQuery('div#exampleDiv').center(); }); jQuery('button#close').click(function(){ jQuery('div#exampleDiv').hide(); }); }); </script>
// Definition: // Vor jQuery(document).ready(function(){.. jQuery.fn.center = function () { this.css("position","absolute"); this.css("top", (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop() + "px"); this.css("left", (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px"); return this; } // Aufruf: $('selector').center();