title: jQuery Conflict with mousewheel
body: <p>I'm a designer doing a commemoration project for Red Cross Australia's 2004 Tsunami clean up efforts. The project is a timeline to commemorate all the work that has been done for the last few years.</p>
  
  <p><b>Note: As a first time user I wasn't allowed to include more than 1 link, so I'm sorry for all the urls I have pasted in.</b></p>
  
  <p>I'm using two jquery plugins to create the timeline:</p>
  
  <p>This horizontal scroll plugin from <a href="http://www.jqueryfordesigners.com/fun-with-overflows/" rel="nofollow noreferrer">JQuery for designers</a></p>
  
  <p>See <a href="http://www.jqueryfordesigners.com/demo/scrollable-timelines.html" rel="nofollow noreferrer">here</a> for a direct link to the demo timeline-<br/></p>
  
  <p>I have also used the <a href="http://www.colorpowered.com/colorbox/" rel="nofollow noreferrer">Colorbox</a> jquery plugin for displaying pictures and media </p>
  
  <p>There is functionality on the timeline for users to click and drag or use the mouse scroll wheel.</p>
  
  <p>I have an issue where the mouse scroll wheel doesn't work after I add the colorbox code to the page. The timeline works fine on its own as does colorbox, its just when they are added together.</p>
  
  <p>As a designer primarily, I don’t know how to fix the issue, but I have narrowed down the focus to some sort of conflict when the jquery.min.js file is linked to for the colorbox plugin. The mouse wheel scrolling returns if I remove the link to this js in the head.</p>
  
  <p>Any suggestions would be welcomed.</p>