CODEWITHSUNDEEP
jqueryhtml
piku
piku

Reputation: 285

how to make whole div clickable?

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?

Upvotes: 2

Views: 3750

Answers (3)

Dr Casper Black
Dr Casper Black

Reputation: 7478

try to give the div class a width and height and display: block;

Upvotes: 1

Adam
Adam

Reputation: 44929

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

You may want to change the mouse cursor so it looks clickable:

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

Upvotes: 1

twerq
twerq

Reputation: 528

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; }

Upvotes: 5

Related Questions