Changing li class on horizontal scroll

oh_sugahh

New Member
I want to know if it's possible to change my "selected" \[code\]li\[/code\] class based on the movements of the horizontal scroll. So when you start moving the scroll to the right, the selected \[code\]li\[/code\] class would change to 2, 3, 4 .. and so on.Any hints or points to start from are appreciated.My code:\[code\]<div id="scroller"><ul id="ulscroller"><li value="http://stackoverflow.com/questions/14526503/1" class="selected">1</li><li value="http://stackoverflow.com/questions/14526503/2">2</li><li value="http://stackoverflow.com/questions/14526503/3">3</li><li value="http://stackoverflow.com/questions/14526503/4">4</li><li value="http://stackoverflow.com/questions/14526503/5">5</li><li value="http://stackoverflow.com/questions/14526503/6">6</li><li value="http://stackoverflow.com/questions/14526503/7">7</li><li value="http://stackoverflow.com/questions/14526503/8">8</li><li value="http://stackoverflow.com/questions/14526503/9">9</li><li value="http://stackoverflow.com/questions/14526503/10">10</li><li value="http://stackoverflow.com/questions/14526503/11">11</li><li value="http://stackoverflow.com/questions/14526503/12">12</li><li value="http://stackoverflow.com/questions/14526503/13">13</li><li value="http://stackoverflow.com/questions/14526503/14">14</li><li value="http://stackoverflow.com/questions/14526503/15">15</li><li value="http://stackoverflow.com/questions/14526503/16">16</li><li value="http://stackoverflow.com/questions/14526503/17">17</li><li value="http://stackoverflow.com/questions/14526503/18">18</li><li value="http://stackoverflow.com/questions/14526503/19">19</li><li value="http://stackoverflow.com/questions/14526503/20">20</li></ul></div>\[/code\]CSS:\[code\]li {float:left; padding:10px; cursor: pointer;} div#scroller {width:300px; height:70px; overflow-x: scroll;} ul#ulscroller {list-style: none outside none; margin: 0; padding: 0; width:655px;} ul#ulscroller li.selected {border:1px solid #000;}\[/code\]Fiddle: http://jsfiddle.net/7uCS8/
 
Back
Top