Question

My background image having width:118px,On clicking on background image i want to perform some jquery, i cant use <a> tag.How to make cursor:pointer only on background and how to give a class name only for the background? Is it possible? how?

<div id="post1_img"></div>

    #post1_img
 {
    width:280px;
height:33px;
background:url(../images/assets/pullTab-readMore-off-.png) no-repeat top center;
clear:both;
  }

EDIT

clicking on read more i want to perform some action,Is it possible to do without creating any extra div

width of div:280px;

width of image:118px;

http://jsfiddle.net/prash/A8FWa/

Answer 1

you can put the background image as an background of a div which has the same dimension with the image. then place this div centered inside another div.

<div id="outer">
  <div id="post1_img">
   </div>
</div>

//css
#post1_img{
   width:70px;
   cursor:pointer;
   background:url(pullTab-readMore-off-.png) no-repeat top center;
   /*you need more css here to adjust this div to be center of the outer div*/
}
#outer{
   width:280px;
}

//jquery
$('#post1_img').click(function(){
    //do something
});