Exemple de code de la propriété JS / CSS backgroundPosition.

<style>
.cadre-gris{ margin : 5px 0; }
.fg{ width : 250px; height : 250px; background-repeat : no-repeat; }
.fgs{ background-image: url(/images/exemple/filter-image.jpg) }
.fgd{ background-image: url(/images/exemple/grille150.gif), url(/images/exemple/filter-image.jpg) }
</style>
<div class="cadre-exemple cadre-clickme" id="exemple">
  <h3 id="exemple-desc">Valeur par défaut</h3>
  <div class="cadre-gris">
  <div id="exemple-desc-0">Valeur js récupérée</div>
  <div id="exemple-style-0" class="cadre-vert fg fgs" >Effet backgroundPosition</div>
  </div>
</div>
<div class="cadre-exemple cadre-clickme" id="exemple1">
  <h3 id="exemple-desc1">Valeur par défaut</h3>
  <div class="cadre-gris">
  <div id="exemple-desc-01">Valeur js récupérée</div>
  <div id="exemple-style-01" class="cadre-vert fg fgd">Effet backgroundPosition</div>
  </div>
</div>
<script>
initExemple('background-position',  'backgroundPosition', ['left center', 'right top', 'bottom center','30% 5%','3em 5px','3em 5pt'], 1); 
initExemple('background-position',  'backgroundPosition', ['left center, 3em 5px', 'right top, bottom center', 'bottom center, right top','30% 5%','3em 5px, left center','3% 5px, left 10px'], 1, 1); 
</script>