Tengo un codigo que me permite dandole a un boton, aparecer un texto en un div con un efecto fade in y fade out, y subir y bajar dicho texto con un scrollbar con efecto smooth
y funciona bien pero...
cuando le doy al boton y aparece el texto del contenido, y bajo hacia abajo con el scrollbar
y dejo el scrollbar por ahí en medio o por abajo de la ventana. Si le doy al boton de inicio y de nuevo le doy al boton del contenido del texto, el scrollbar no me aparece arriba del todo, que es donde me gustaria que estuviera, sino que aparece el scrollbar donde lo deje la vez anterior, osea por ahí en medio o donde lo hubiese dejado la vez anterior que entre.
Si alguien me pudiera ayudar le estaria muy agradecido.
este es el codigo:
jquery-1.10.2.min.js
jquery.nicescroll.min.js
Código Javascript:
Ver original
// inicialmente aparece la primera opcion marcada var ultimo=1; $(document).ready(function(){ // evento que se ejecutara al seleccionar cualquier opcion del menu $(".btns_menu div").click(function(){ // obtenemos el nuevo id nuevo=$(this).attr("id"); if(nuevo!=ultimo) { // escondemos el ultimo id $("#opc_"+ultimo).fadeOut(function(){ $("#"+ultimo).removeClass("seleccionado"); $("#"+nuevo).addClass("seleccionado"); // mostramos el nuevo id $("#opc_"+nuevo).fadeIn(); ultimo=nuevo; }); } }); });
Código CSS:
Ver original
body {background-color:#666666;} .contenedor_opcs { display:none; overflow:auto; padding-right:40px; margin-top:70px; margin-left:48px; width:898px; height:260px; } .cursor {cursor:pointer; cursor:hand;}
Código Javascript:
Ver original
$(document).ready(function() { $(".contenedor_opcs").niceScroll({touchbehavior:false,cursorcolor:"#555452",cursoropacitymax:0.7,cursorwidth:5,background:"none",autohidemode:false}); });
Código HTML:
Ver original
<div class="btns_menu"> </div> <br/> <hr/> <br/> <div id="opc_1" class="contenedor_opcs" class="seleccionado" style="display:block;"> contenido inicio (vacio) </div> <div id="opc_2" class="contenedor_opcs"> contenido de Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula aliquam purus. Duis blandit egestas ipsum a faucibus. Nulla sit amet fermentum nisl, ut dignissim diam. Donec vel aliquet justo, sit amet consequat arcu. Duis sit amet ipsum nisi. Curabitur rhoncus pretium bibendum. Sed blandit nisi nec ligula iaculis venenatis. Vivamus elementum, urna eu condimentum ullamcorper, nisl elit cursus dolor, sit amet sagittis justo quam et est. Aliquam erat volutpat. Quisque feugiat tincidunt massa, sit amet blandit massa pellentesque quis. Pellentesque porta ut quam et hendrerit. Integer luctus convallis adipiscing. Fusce ut ornare ante. Nulla facilisi. Suspendisse a molestie nisl. Nullam vel nulla tincidunt, eleifend urna vitae, auctor tellus. Proin sollicitudin neque et porta vestibulum. Nunc et nulla a est aliquam sagittis id non purus. Duis nulla est, blandit vel dapibus vel, tempor eu eros. Ut tristique nibh lectus, vitae molestie nibh tempus id. Donec accumsan volutpat elementum. Donec eget massa lobortis, rutrum ligula nec, convallis lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec massa nulla, ultricies id mattis sit amet, sodales nec quam. Sed ligula magna, condimentum eu facilisis non, luctus euismod libero. Mauris ac adipiscing magna. Nunc semper sapien arcu, ac rhoncus ligula molestie in. Proin ut tempor magna, a volutpat nunc. Quisque suscipit lacus non urna pellentesque hendrerit. Proin sapien libero, ornare cursus arcu at, sagittis euismod nisl. Vestibulum gravida rutrum libero sollicitudin adipiscing. Suspendisse ligula elit, consequat at turpis id, vehicula lacinia lorem. Aenean imperdiet lobortis elit in lobortis. Nullam vulputate iaculis est, quis viverra augue ultricies nec. Curabitur ut egestas risus, non ultrices ligula. Donec tempor facilisis diam. Nulla condimentum sagittis sem eget volutpat. Vestibulum turpis magna, fringilla eu urna id, porttitor sagittis enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent vulputate accumsan lectus, eu accumsan massa luctus posuere. Fusce vestibulum massa est, vehicula vehicula risus vulputate tempor. Donec egestas aliquet felis, vel adipiscing felis imperdiet quis. Curabitur non suscipit elit. Suspendisse accumsan lectus ligula, sit amet dapibus lorem rutrum vel. Cras quis dignissim leo. Integer gravida leo quis mi bibendum, non dapibus dui eleifend. Pellentesque ultricies scelerisque fringilla. </div>