jQuery 1.7.2 - Select menu option mouseover shouldn't display preceding image in list

jQuery 1.7.2 - Select menu option mouseover shouldn't display preceding image in list

Stuck here with sorta dilemma, I use this code to allow display of images in div via mouseover of select menu option:
  1. $("#selectMenu").on("mouseover change", function() {
  2.     oScroll2.tinyscrollbar_update($(this).val());
  3. return false;
  4. });
Line 2 of code scrolls the appended images contained in horizontal ul li to an anchor (Tiny Scrollbar figures that out) set by value of select option.

There are currently 11 anchors for 11 images, but this will grow. Anchor 1 is option value="1" (for first image); anchor 2 is option value="612" (for second image); anchor 3 is option value="1224" (for third image), etc. Those values are the pixel traveling distances (right to left) between left margin of div container and left margin of selected image (for scrolling - images are 612px wide).

EDIT: My prob is the following: When I mouseover any option in the select menu, it is the previous item (image) in the list that appears, regardless of direction. When I click on the option, however, everything works as it should. the correct image appears. Looks like something silly I dunno of... . What gives? - dan

UPDATE - Ok, here's the scoop, I tried "hover", "mouseover", "mouseenter, "select", and all of them trigger option item once you lose focus of option item with mouse (move onto the next item). Has this always been an issue with select menus? "Thud" !! Guess I need a function that supercedes this? Note: ".change() - event is deferred until the element loses focus."- jQuery API. Yup, I do need a function!







    • Topic Participants

    • i1drr