Schlagwort: jQuery

jQuery 1.8 fügt Vendor-Prefixes automatisch hinzu

Um keine Komplikationen mit noch nicht verabschiedeten CSS3-Standards zu haben, verwenden die großen Browserhersteller eigene Präfixe (sog. vendor prefixes) um die kommenden Standards bereits jetzt zu implementieren. Dadurch wird aus dem einfachen CSS-Attribut transform: scaleX(-1) mal eben ein ganzer Codeblock:
jQuery 1.8 fügt Vendor-Prefixes automatisch hinzu weiterlesen

Eigene Events mit jQuery Bind und Trigger

Mit jQuery ist es möglich, eigene JavaScript-Events zu definieren und auszulösen (trigger). Alle Elemente, die an dieses Ereignis gebunden (bind) sind, werden dann benachrichtigt und können eine eigene Ereignisbehandlung vornehmen:
Eigene Events mit jQuery Bind und Trigger weiterlesen

Auf Touch und Click-Events reagieren mit jQuery

Im modernen Web tummeln sich nicht nur Desktops und Laptops sondern auch Smartphones, Tablets und viele andere Geräte. Entsprechend vielfältig sind die Eingabemethoden. Einen Desktop-PC bedient man am Liebsten mit der Maus und bei einem Smartphone wischt man gerne mit dem Finger drüber. Diese beiden Bedienkonzepte (Click und Touch) müssen berücksichtigt werden. In jQuery kann man dazu verschiedene Event-Typen benutzen, an die man sich im Code bindet.
Auf Touch und Click-Events reagieren mit jQuery weiterlesen

jQuery UI slider with labels

If you want a jQuery UI slider with labels that looks like this:

Then this JavaScript code might help you:

$('#slider').slider({
  min: 1,
  max: 20,
  step: 1,
  value: 16,
  create: function(event,ui){
    $('a.ui-slider-handle').css({'text-decoration':'none','text-align':'center'}).text($(this).slider("value"));
  },
  slide: function(event,ui){
    $('a.ui-slider-handle').css({'text-decoration':'none','text-align':'center'}).text(ui.value);
  }
});

How to send a JSON object with jQuery

Here is an example on how you can send a JSON object to a server with jQuery:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
  var data = {
    "name": "Neugebauer",
    "prename": "Benny",
    "age": 24,	
    "likes": [],        
    "device": "Laptop"
  };
 
  jQuery(document).ready(function($){
    $.ajax({
      type: "POST",
      url: "https://www.bennyn.de/rest-service/something",
      data: typeof data == "string" ? data : JSON.stringify(data || {}),
      dataType: "json",
      contentType: "application/json; charset=utf-8",
      success: function(data, textStatus, jqXHR){
        console.log('OK:' + data);
      },
      error: function(data, textStatus, jqXHR){ 
        console.log('ERROR:' + data);
      }
    });
  });      
</script>