Question

I’m working on a site that on form submit returns search values. What I’m trying to do is on submit scrollTo (down) to the results section. Works with a button outside a form but not within a form.

Example : this will work

  $(function (){
    $("#fb-advanced-submit").click(function (){
            $('html, body').animate({
                scrollTop: $("#fb-results").offset().top
                 }, 1300);
    });
});

<button id="fb-advanced-submit">Submit</button>

but this doesn’t

<form action="" method="Get">
<input type="submit" id="#fb-advanced-submit" value="Search" class="small button" />

   <div id="div2" style="height: 1000px; width 100px">test</div>
  <br/>
  <div id="fb-results" style="height: 1000px; width 100px">test 2</div>
</form>

jsfiddle

Answer 1

You need to stop submit action

  $(function (){
        $("#notworking,#fb-advanced-submit").click(function (){
                $('html, body').animate({
                    scrollTop: $("#fb-results").offset().top
                     }, 1300);
            return false;
        });
    });​