title: setting image visible area in css
body: <p>I am using jCarousel to make a image slider of logos. In that the image should not be used as background it should be with in the image tag, thats the requirement. So placed all images with in li tag. and the jCarousel is working fine. </p>
  
  <p>But here i have to show only half of the picture(sprite image [default,mouse over image]) by default and on the mouse over another part. In css how to set up image position to show only half of the picture and on the mouse over another half.</p>
  
  <p>See the screenshot.</p>
  
  <p><img src="https://i.stack.imgur.com/vOL7H.png" alt="enter image description here"></p>
  
  <p>Thanks</p>