jquery - Auto Scroll to Div Override -


i have list of links href if each link div on current page can change div display setting when clicked javascript. current annoying issue when click on link scrolls div location. don't want scroll div need show it.

links in list

<li><a href="#victimcenterdiv" class="side-a-li">the crime                         victims center</a></li>                 <li><a href="#victimrightsdiv" class="side-a-li">crime                         victim legal rights</a></li> 

div , css

<div id="victimcenterdiv" class="ui-div-interface ui-show">             <span>12345</span>         </div>   .ui-div-interface {     background: none;     top: 10%;     position: absolute;     left: 9%;     width: 100%;     height: 100%;     display: none; }  .ui-show {     display: block !important; } 

finally javascript/jquery responsible:

<script>     $(document).ready(function() {         $('a').not($('#search-reg-options')).click(function() {             $('.ui-show').removeclass('ui-show')             var mydiv = $(this).attr('href');             $(mydiv).addclass('ui-show');         });          $('#search-reg-options').click(function() {             $('.options-shown').removeclass('options-shown')             var mydiv = $(this).attr('href');             $(mydiv).addclass('options-shown');         });     }); </script> 

question how stop auto scroll happens when clicks links have in list?

the reason view automatically scrolls because a anchored div id of victimcenterdiv, since have attribute href="#victimcenterdiv".

you can change attribute href="#". alternatively, can remove href attribute altogether in html5.

however, jquery code depends on href. means have add different attribute code differentiate div make visible. 1 way data-* attributes. allows embed custom attributes custom values a tag.

<a data-display="#victimcenterdiv" class="side-a-li"> 

to value of data attribute in jquery, use data() method.

var mydiv = $(this).data('display'); $(mydiv).addclass('ui-show'); 

Comments

Popular posts from this blog

html - Outlook 2010 Anchor (url/address/link) -

javascript - Why does running this loop 9 times take 100x longer than running it 8 times? -

Getting gateway time-out Rails app with Nginx + Puma running on Digital Ocean -