title: Set div background as photo taken with Camera
body: <p>I'm building a mobile app using PhoneGap in Android and am trying to set the background of a div to the photo that is taken using the camera. </p>
  
  <p>I've got the camera working fine (code below), however after taking the photo I want to immediately set the background image of the body div as the photo instead of just showing the user their photo. </p>
  
  <pre><code>var pictureSource;   // picture source
  var destinationType; // sets the format of returned value 
  
  // Wait for PhoneGap to connect with the device
  //
  document.addEventListener("deviceready",onDeviceReady,false);
  
  // PhoneGap is ready to be used!
  //
  function onDeviceReady() {
      pictureSource=navigator.camera.PictureSourceType;
      destinationType=navigator.camera.DestinationType;
  }
  
  // Called when a photo is successfully retrieved
  //
  function onPhotoDataSuccess(imageData) {
    // Uncomment to view the base64 encoded image data
    // console.log(imageData);
  
    // Get image handle
    //
    var smallImage = document.getElementById('smallImage');
  
    // Unhide image elements
    //
    smallImage.style.display = 'block';
  
    // Show the captured photo
    // The inline CSS rules are used to resize the image
    //
    smallImage.src = "data:image/jpeg;base64," + imageData;
  
    //set the background here?
    $('#wrapper').css("background-image", "url(imageData.jpg)"); 
  }
  
  // Called when a photo is successfully retrieved
  //
  function onPhotoURISuccess(imageURI) {
    // Uncomment to view the image file URI 
    // console.log(imageURI);
  
    // Get image handle
    //
    var largeImage = document.getElementById('largeImage');
  
    // Unhide image elements
    //
    largeImage.style.display = 'block';
  
    // Show the captured photo
    // The inline CSS rules are used to resize the image
    //
    largeImage.src = imageURI;
  }
  
  // A button will call this function
  //
  function capturePhoto() {
    // Take picture using device camera and retrieve image as base64-encoded string
    navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });
  }
  
  // A button will call this function
  //
  function capturePhotoEdit() {
    // Take picture using device camera, allow edit, and retrieve image as base64-encoded string  
    navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true }); 
  }
  
  // A button will call this function
  //
  function getPhoto(source) {
    // Retrieve image file location from specified source
      navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50, 
      destinationType: destinationType.FILE_URI,
      sourceType: source });
  }
  
  // Called if something bad happens.
  // 
  function onFail(message) {
    alert('Failed because: ' + message);
  }
  </code></pre>
  
  <p>To set the background in previous code, i've used the following:</p>
  
  <pre><code>$('#wrapper').css("background-image", "url(imageData.jpg)")
  </code></pre>
  
  <p>Any help would be great.</p>