Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Aug 8th, 2012  |  syntax: None  |  size: 2.29 KB  |  hits: 8  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. Javascript event listener works in browser, not in phonegap?
  2. $(function () {
  3. $("#red, #green, #blue").change(function () {
  4.     var red = $("#red").val();
  5.     var green = $("#green").val();
  6.     var blue = $("#blue").val();
  7.     var redp = Math.round((red * 100) / 255);
  8.     var greenp = Math.round((green * 100) / 255);
  9.     var bluep = Math.round((blue * 100) / 255);
  10.     $('#redrgb').html(red);
  11.     $('#greenrgb').html(green);
  12.     $('#bluergb').html(blue);
  13.     $('#redpercent').html(redp + "%");
  14.     $('#greenpercent').html(greenp + "%");
  15.     $('#bluepercent').html(bluep + "%");
  16.     $("#swatch").css("background-color", "rgb(" + red + "," + green + "," + blue + ")");
  17.     console.log(red);  });  });
  18.        
  19. <div id="colorpicker">
  20.     <div id="swatch">
  21.         <div class="rgb swatchtext" id="redrgb">255</div><div class="percent swatchtext" id="redpercent">100%</div>
  22.         <div class="rgb swatchtext" id="greenrgb">140</div><div class="percent swatchtext" id="greenpercent">55%</div>
  23.         <div class="rgb swatchtext" id="bluergb">60</div><div class="percent swatchtext" id="bluepercent">24%</div>
  24.     </div>
  25.     <div class="rgbslider" id="sliderred"><input type="range" class="rgbsliders" id="red" value="255" min="0" max="255" /></div>
  26.     <div class="rgbslider" id="slidergreen"><input type="range" class="rgbsliders" id="green" value="140" min="0" max="255" /></div>
  27.     <div class="rgbslider" id="sliderblue"><input type="range" class="rgbsliders" id="blue" value="60" min="0" max="255" /></div>
  28. </div>
  29.        
  30. $(function () {
  31. $("#red, #green, #blue").slider({
  32.     create: function (event, ui) {
  33.         $(this).bind('change', function () {
  34.             var red = $("#red").val();
  35.             var green = $("#green").val();
  36.             var blue = $("#blue").val();
  37.             var redp = Math.round((red * 100) / 255);
  38.             var greenp = Math.round((green * 100) / 255);
  39.             var bluep = Math.round((blue * 100) / 255);
  40.             $('#redrgb').html(red);
  41.             $('#greenrgb').html(green);
  42.             $('#bluergb').html(blue);
  43.             $('#redpercent').html(redp + "%");
  44.             $('#greenpercent').html(greenp + "%");
  45.             $('#bluepercent').html(bluep + "%");
  46.             $("#swatch").css("background-color", "rgb(" + red + "," + green + "," + blue + ")");
  47.             console.log(red);
  48.         });}});});