Помогите пожалуйста дописать 1 функцию (onmouseout)
Вложений: 1
Доброго времени суток.
Есть скрипт динамической прокрутки. Убрал чешую и выложил тут. http://store-cd.spb.ru/ При наведении он прокручивается Очень хочется сделать так, чтобы при перемещении курсора за пределы области, он плавно(или хотя бы не плавно) возвращался в начало. В Java и его проявлениях не силен. Честно пробовал реализовать через onmouseout или обновление элемента, но руки оттуда откуда ноги. <head> <script src="jquery.min.js" type="text/javascript"></script> <style type="text/css"> div.sc_menu { /* Set it so we could calculate the offsetLeft */ position: relative; height: 132px; width: 457px; overflow: auto; } ul.sc_menu { display: block; height: 110px; /* max width here, for users without javascript */ width: 1500px; padding: 15px 0 0 15px; /* removing default styling */ margin: 0; background: url('navigation.png'); list-style: none; } .sc_menu li { display: block; float: left; padding: 0 4px; } .sc_menu a { display: block; text-decoration: none; } .sc_menu span { display: none; margin-top: 3px; text-align: center; font-size: 12px; color: #fff; } .sc_menu a:hover span { display: none; } .sc_menu img { border: 1px #fff solid; height: 105px; margin-top: 5px; } .sc_menu a:hover img { filter:alpha(opacity=50); opacity: 0.5; } </style> <script type= "text/javascript">/*<![CDATA[*/ $(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> </head> <body> <div class="sc_menu"> <ul class="sc_menu"> <li><a href=""><img src="mx1547.jpg" alt="mx1547"/><span>mx1547</span></a></li> <li><a href=""><img src="mv0546.jpg" alt="mv0546"/><span>mv0546</span></a></li> <li><a href=""><img src="eco.jpg" alt="eco"/><span>eco</span></a></li> <li><a href=""><img src="mv038.jpg" alt="mv038"/><span>mv038</span></a></li> <li><a href=""><img src="mv1047.jpg" alt="mv1047"/><span>mv1047</span></a></li> <li><a href=""><img src="md1548.jpg" alt="md1548"/><span>md1548</span></a></li> <li><a href=""><img src="mv046.jpg" alt="mv046"/><span>mv046</span></a></li> <li><a href=""><img src="eco2sy.jpg" alt="eco"/><span>eco</span></a></li> </ul> </div> </body> :help: Буду благодарен Если что, html-ка и библиотека во вложении |
Часовой пояс GMT +3, время: 13:23. |