javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

i have button on website when clicked, reveals map. button can seen when page first loads up, when clicked, section holding map slides open , goes out of screen since page loads @ top (normal). want page scroll down bottom of div select when button pushed, if map out of screen. if page scrolled down, , clicks show map button, don't want page jump bottom of map.

i tried figure out myself, no luck. seasoned jquery coders able give me guidance?

many thanks!

    map = mapdiv.gmap3("get");     infobox = new infobox({         pixeloffset: new google.maps.size(-220, -310),         closeboxurl: '',         enableeventpropagation: true     });     mapdiv.delegate('.infobox .close','click',function () {         infobox.close();     });      jquery(".slidingdiv").hide();      jquery(".show_hide").show();      jquery('.show_hide').click(function(){          lastcenter=map.getcenter();          jquery(".slidingdiv").slidetoggle();          google.maps.event.trigger(map, 'resize');          map.setcenter(lastcenter);          return false;      }); 

here's animated way scrollto element.

 $("#buttonid").click(function() {         $('html, body').animate({             scrolltop: $("#divid").offset().top         }, 2000);     }); 

you use window.scrollto method

   $(document).ready(function()){    function scroll(){       if(clicked){          window.scrollto(0,750); // scroll where?          }              )}; 

scrollto plugin

$(function() {     $('yourelementname').click(function() {         $.scrollto( '#elementid', 800); // 800 speed.               }); }); 

or use javascript told here.

hope solution works out you.