jQuery slider opacity error only on Google Chrome

jQuery slider opacity error only on Google Chrome

I have a custom built slider on a Magento site. It's responsive and have
custom touch behaviour on it. The behaviour should be the following:
Three images slider, the middle one should have opacity 1.0, the rest just
0.15
On smaller resolutions, only show 2 images. The one on the right should
have 1.0 the left image should have 0.15 opacity
On mobile, show 1 image. The current shown image should have 1.0 opacity.
I made it work with CSS/jQuery mix.
HTML
<ul class="more-views">
<li><a href="someURL"><img src=..... /></li>
<li class="active"><a href="someURL"><img src=..... /></li>
<li><a href="someURL"><img src=..... /></li>
<li><a href="someURL"><img src=..... /></li>
<li><a href="someURL"><img src=..... /></li>
</ul>
CSS .more-views ul li { opacity: .15; } .more-views ul li.active {
opacity: 1.0; }
JAVASCRIPT is long, you might want to inspect element. But the idea is the
following. When you click NEXT arrow, the first element of the list is
cloned, appended to the back of the and destroyed from the first position.
Later on the active class is removed and added to the second <li> in the
list. Something like this
<ul>
<li class="elem1"></li>
<li class="elem2 active"></li>
<li class="elem3"></li>
<li class="elem4"></li>
</ul>
STEP 1
<ul>
<li class="elem1"></li>
<li class="elem2 active"></li>
<li class="elem3"></li>
<li class="elem4"></li>
<li class="elem1"></li>
</ul>
STEP 2
<ul>
<li class="elem2 active"></li>
<li class="elem3"></li>
<li class="elem4"></li>
<li class="elem1"></li>
</ul>
STEP 3
<ul>
<li class="elem2"></li>
<li class="elem3 active"></li>
<li class="elem4"></li>
<li class="elem1"></li>
</ul>
Current small issue is the following: 1. If you click the right arrow
(next arrow) one time, the first element in the list keeps the opacity as
1.0 (only on Chrome). 2. If you inspect the element is says it has an
opacity of 0.15 3. If you resize the browser you'll see that the opacity
is set to .15 again 4. If you enable/disable the opacity in Firebug it
works like it should. 5. If you click 2 times on the next arrow the
opacity error disappears.
You can see the live example here:
http://www.mackage.com/ca/en/jeffrey-black-leather-jacket