how to make whole div clickable?

Question

html-

<div class="hbg">
</div>

some menu items here

jquery for mouser over on menu items-

function imgchange()
    {
        $('.smenu li').mouseover( function(){
        var src = $(this).find('a').attr('alt');
        $('.hbg').css('background-image', 'url(' + src + ')');
        $(this).find('hbg').attr('title', 'my tootip info');
        });     
    }

I am changing the background image of hbg div through jquery on mouse over of menu items(ul li).but i want to bind(href) that div to particular page also so that when user clicks anywhere on div it should redirect to that binded page.as it is redirecting on clickin on li items.
Is there any property in jquery where we can set the whole div as hyperlink?

Answer 1

Here is how you bind a click handler to the div:

$('div.hbg').click(function(e) {
  alert('The div was clicked!');
});

And you probably also want to style it to look clickable:

div.hbg { cursor: pointer; }

Answer 2

$('div.hbg').click(function(){location.href='http://www.google.com'});

您可能需要更改鼠标光标，使其看起来可点击：

$('div.hbg').css('cursor','pointer');

Answer 3

尝试给div类一个宽度和高度并显示：block;