код такой
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>
<div id="footer"> <script type="text/javascript"> $(document).ready(function(){ //Get our elements for faster access and set overlay width var div = $('div.sc_menu'), ul = $('ul.sc_menu'), ulPadding = 15; //Get menu width var divWidth = div.width(); //Remove scrollbars div.css({overflow: 'hidden'}); //Find last image container var lastLi = ul.find('li:last-child'); //When user move mouse over menu div.mousemove(function(e){ //As images are loaded ul width increases, //so we recalculate it each time var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding; var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth; div.scrollLeft(left); }); }); </script> <div class="sc_menu"> <ul class="sc_menu"> <li><a href="#">1<br/>2<br/>3<br/>4<br/>5</a></li> <li><a href="#">6<br/>7<br/>8<br/>9<br/>10</a></li </ul> </div>