Smooth Scrolling using JQuery when link and target are in different documents

I have a website where main navigational links link to a single document loaded in iframe. How can I make scrolling smoother iframe html document. I have an example code that does 开发者_开发问答this on

$('ul.nav a').bind('click',function(event) 

But i cant catch this event because it is in another document.

How should I make this horizontal scrolling.

You are using jQuery. So you can...

to smooth scroll the page:

jQuery(window).animate({
   scrollTop:30px;
}, 200);

to get the Top-Offset of the element you want to scroll to:

jQuery(element_you_want_to_scroll_to).offset().top

to catch the href of a link, so that the browser do not handle the href:

jQuery('ul.nav a').bind('click', function(event) { 
   /* your scrolling-code here */
   return false;
});

to get the iframe as needed element in jQuery-Selector:

you can use the iFrame Name:

jQuery('your_selector', frames['your_iframe_name'].document)

or you can use the iFrame Id:

jQuery('#your_iframe_id').contents().find('your_selector')

maybe useful:

to pass variables in a right way to the Click-Function:

jQuery('ul.nav a').bind('click', {foo:'bar'}, function(event) { 
   alert(event.data.foo); //alert: 'bar'
   /* your scrolling-code here */
   return false;
});