stoy tratando de lograr el efecto del scroll dentro de un div... pero no lo he logrado.... alguien me puede ayudar con esto?.... ahi les dejo el codigo
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>HOJA DE VIDA</title> <script language="javascript" type="text/javascript" src="js/jquery.js"></script> <script language="javascript" type="text/javascript" src="js/jquery.scrollTo.js"></script> <script> $(document).ready(function () { $("a").click( function() { cual = $(this).attr("id"); switch (cual) { case "top": cual = "tblhv"; break; case "empsol": cual = "empleo"; break; case "inffam": cual = "infFamiliar"; break; case "edufor": cual = "educacion"; break; case "enofor": cual = "ednoformal"; break; case "exp": cual = "experincia"; break; } ir = "#"+cual; $(ir).animate({ scrollTop: $(ir).offset().top }, 1500); return false; }); }) </script> <style> #hojadevida { overflow: auto; border-radius: 10px; box-shadow: 0 0 3em #EEF5F7; -webkit-box-shadow: 2px 2px 5px #999; -moz-box-shadow: 2px 2px 5px #999; filter: shadow(color=#999999, direction=135, strength=9); margin: 8px 0; margin-left: 150px; width: 1100px; height: 440px; } #nav-dock { position: fixed; left: 10px; top: 10%; } #nav-dock a { width: 135px; display: block; padding: 3px 10px; margin: 3px 0; background: #666; color: #fff; -webkit-border-radius: 10px; -moz-border-radius: 10px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .3); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .3); } </style> </head> <body> <form id="formConsultaHv"> <div id="hojadevida" align="center"> <table id="tblhv" align="center" border="1" class="tabla"> <tbody id="datoshv"> <th colspan="6"><strong>DATOS PERSONALES</strong></th> <tr> <th><strong>Documento</th> <td id="doc"></td> <td align="center" rowspan="5" style="font-family: Verdana;"> <table align="center"> <div id="fotox" style="border-left-color: #85ae35; border-bottom-color: #85ae35; border-top-style: solid; border-top-color: #85ae35; border-right-style: solid; border-left-style: solid; background-color: #f4f9ec; border-right-color: #85ae35; border-bottom-style: solid; width: 86px; position: static; top: 205px; height: 114px; vertical-align: bottom;"> <img id="image-list" width="86px" height="114px"/> </div> </table> </td> </tr> <tr> <th><strong>Nombres</th> <td id="nom"</td> </tr> <tr> <th><strong>Apellidos</th> <td id="ape"</td> </tr> <tr> <th><strong>Lugar De Nacimiento</th> <td id="lnace"></td> <tr> <th><strong>Fecha De Nacimiento</th> <td id="fnace"></td> </tr> <tr> <th><strong>Genero</th> <td id="genero"></td> </tr> <tr> <th><strong>Grupo Sanguineo</th> <td id="gruposan"></td> </tr> <tr> <th><strong>Estado Civil</th> <td id="ecivil"></td> </tr> <tr> <th><strong>Correo electronico</th> <td id="email"></td> </tr> <tr> <th><strong>Libreta Militar</th> <td id="libreta"></td> </tr> <tr> <th><strong>Certificado judicial</th> <td id="certifjudicial"></td> </tr> <tr> <th><strong>Pasaporte</th> <td id="pasaporte"></td> </tr> <tr> <th colspan="6"><strong>RESIDENCIA</strong></th> </tr> <tr> <th><strong>Lugar De Residencia</th> <td id="lugarresi"></td> </tr> <tr> <th><strong>Barrio</th> <td id="barrio"></td> </tr> <tr> <th><strong>Localidad/Comuna</th> <td id="localidad"></td> </tr> <tr> <th><strong>Direccion</th> <td id="direccion"></td> </tr> <tr> <th><strong>Telefono</th> <td id="telefono"></td> </tr> <tr> <th><strong>Movil</th> <td id="movil"></td> </tr> <tr> <th colspan="6"><strong>CONTACTO</strong></th> </tr> <tr> <th><strong>Nombre</th><td id="nomcontacto"></td> </tr> <tr> <th><strong>Telefono</th><td id="telcontacto"></td> </tr> </tbody> </table> <br></br> <table id="empleo" align="center" border="1" width="550px" class="tabla"> <tbody> <tr> <th colspan="6"><strong>EMPLEO QUE SOLICITA</strong></th> </tr> <tr> <th><strong>Tipo De Empleo</th> <td id="tipoEmp"></td> </tr> <tr> <th rowspan="3"><strong>Cargos A Los Que Aspira</th> <td id="car1"></td> </tr> <tr> <td></td> <td id="car2"></td> </tr> <tr> <td></td> <td id="car3"></td> </tr> <tr> <th><strong>Aspiracion Salarial</th> <td id="asp"></td> </tr> </tbody> </table> <br></br> <table id="infFamiliar" align="center" width="550px" border="1" class="tabla"> <tbody> <th colspan="6"><strong>INFORMACION FAMILIAR</strong></th> </tr> <tr> <th rowspan="8"><strong>Conyuge</th> </tr> <tr> <th><strong>Nombre</th><td id="nomconyuge"></td> </tr> <tr> <th><strong>Documento</th> <td id="docconyuge"></td> </tr> <tr> <th><strong>Fecha Nacimiento</th> <td id="fnaceconyuge"></td> </tr> <tr> <th><strong>Profesion</th> <td id="profesionconyuge"></td> </tr> <tr> <th><strong>Empresa</th> <td id="empreconyuge"></td> </tr> <tr> <th><strong>Direccion</th> <td id="diremp"></td> </tr> <tr> <th><strong>Telefono</th> <td id="telemp"></td> </tr> <tr> <th rowspan="4"><strong>Padre</th> </tr> <tr> <th><strong>Nombre:</th><td id="nompadre"></td> </tr> <tr> <th><strong>Profesion:</th><td id="profpadre"></td> </tr> <tr> <th><strong>Fecha Nacimiento:</th><td id="fnace_padre"></td> </tr> <tr> <th rowspan="4"><strong>Madre</th> </tr> <tr> <th><strong>Nombre:</th><td id="nommadre"></td> </tr> <tr> <th><strong>Profesion:</th><td id="profmadre"></td> </tr> <tr> <th><strong>Fecha Nacimiento:</th><td id="fnace_madre"></th> </tr> <tr></tr> <tr></tr> <tr></tr> <tr></tr> <tr> <th colspan="6"><strong>PERSONAS A CARGO ECONOMICAMENTE</strong></th> </tr> <tr> <td colspan="3"> <table id="tbldatosacargo" align="center" border="1" class="basica"> <tbody id="datosacargo"> <th align="center"><strong>Parentesco</strong></th><th align="center"><strong>Nombres</strong></th><th align="center"><strong>Fecha Nacimiento</strong></th> <tr id='lcar_0'><td id='par_0'></td><td id='nom_0'></td><td id='fec_0'></td></tr><tr id='lcar_1'><td id='par_1'></td><td id='nom_1'></td><td id='fec_1'></td></tr><tr id='lcar_2'><td id='par_2'></td><td id='nom_2'></td><td id='fec_2'></td></tr><tr id='lcar_3'><td id='par_3'></td><td id='nom_3'></td><td id='fec_3'></td></tr><tr id='lcar_4'><td id='par_4'></td><td id='nom_4'></td><td id='fec_4'></td></tr><tr id='lcar_5'><td id='par_5'></td><td id='nom_5'></td><td id='fec_5'></td></tr> </tbody> </table> </td> </tr> </tbody> </table> <br></br> <div id="nav-dock"> <a href="#" id="top">DatosPersonales</a> <a href="#" id="empsol">EmpleoSolicitado</a> <a href="#" id="inffam">InformacionFamiliar</a> </div> </div> <form> </body> </html>
Gracias de antemano por su ayuda
Un Cordial Saludo