<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>描点返回</title> <style type="text/css"> * { margin: 0; padding: 0; } body { max-width: 640px; min-width: 320px; margin: 0 auto; overflow-x: hidden; overflow-y: auto; } .box { height: 500px; } .btn { display: block; width: 50%; height: 50px; line-height: 50px; margin: 20px auto 50px; border-radius: 10px; text-align: center; color: #fff; text-decoration: none; filter: alpha(opacity=100 finishopacity=50 style=1 startx=0, starty=0, finishx=0, finishy=150) progid: DXImageTransform.Microsoft.gradient(startcolorstr=red, endcolorstr=blue, gradientType=0); -ms-filter: alpha(opacity=100 finishopacity=50 style=1 startx=0, starty=0, finishx=0, finishy=150) progid: DXImageTransform.Microsoft.gradient(startcolorstr=red, endcolorstr=blue, gradientType=0); /*IE8*/ background: red; /* 一些不支持背景渐变的浏览器 */ background: -moz-linear-gradient(top, red, rgba(0, 0, 255, 0.5)); background: -webkit-gradient(linear, 0 0, 0 bottom, from(#ff0000), to(rgba(0, 0, 255, 0.5))); background: -o-linear-gradient(top, red, rgba(0, 0, 255, 0.5)); } </style> </head> <body> <div class="box" style="background: #A39D9D" id="formTab">第一个</div> <div class="box" style="background: #E7B2B2">第二个</div> <div class="box" style="background: #987F7F">第三个</div> <a href="javascript:;" class="btn" onclick="$('html, body').animate({scrollTop : $('#formTab').offset().top}, 500)">我也要测</a> <script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> </body> </html>
效果图：
简单写在页面里返回指定div：
onclick="$('html, body').animate({scrollTop : $('#form_wrapper').offset().top}, 500)"