javascript - How to avoid using overflow -


i creating navigation/menu bar , want move horizontally cursor moves on it. working not want set overflow property hidden because have drop down tabs should appear when cursor on menu option. if use overflow cut off @ point drop down cut off. inside scroll contains menu options.

var sum = 0;  $("#scroll li").each(function () {    sum += $(this).width() + parseint($(this).css('paddingleft')) + parseint($(this).css('paddingright'))  });  $("#scroll").css('width', sum);    $("#holder").mousemove(function (e) {    x = -(((e.pagex - $('#scroll').position().left) / $("#holder").width()) * ($("#scroll").width() + parseint($("#scroll").css('paddingleft')) + parseint($("#scroll").css('paddingright')) - $("#holder").width()));    $("#scroll").css({      'marginleft': x + 'px'    });   });
#scroll{    height: 30px;    line-height: 30px;    margin-left: 0;    padding: 0 10px;  }  #scroll li {    float: left;    padding: 0 5px;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div id="holder" style="width: 800px;line-height: 30px; /* overflow: hidden; */margin-left: 10px;float: left;">    <div id="scroll" class="nav-collapse"> </div>  </div>

please provide alternate solution using overflow.

without entire sample of code or jsfiddle reference can't can use overflow-x : hidden guess.


Comments

Popular posts from this blog

Android : Making Listview full screen -

javascript - Parse JSON from the body of the POST -

javascript - Chrome Extension: Interacting with iframe embedded within popup -