CSS-Tricks / MovingBoxes

Simple horizontal slider which grows up the current box when it's in focus (image, title & text) and back down when it's not in focus.
http://css-tricks.github.io/MovingBoxes/
GNU Lesser General Public License v3.0
280 stars 147 forks source link

Image flicker when moving to next or previous image in IE #41

Closed aguieb closed 12 years ago

aguieb commented 12 years ago

I just notice this but maybe it’s my pc resolution settings. When navigating to each individual slide I notice that flickers when it moves across the screen.

Mottie commented 12 years ago

Which browser are you using? Are you using any plugins? How big are the images? Are the images resized? What version of the plugin are you using?

Are you including any video in the panels? There are some issues with animating video, especially YouTube in Firefox.

aguieb commented 12 years ago

Using IE8 No plugins I just downloaded your source file and using images present there without any modification.

FYI... I opened your file via firefox and runs much better there. it renders the image in firefox much smoother.

aguieb commented 12 years ago

IE8 is driving me nuts... do i need to install a plugin to make the image scroll smoother?

aguieb commented 12 years ago

FYI... I was told to use this but didn't work

but in order to stop the flicker in IE8 I updated the duration/speed to 100. Its harder to see the flicker when its set to that value

aguieb commented 12 years ago

Got it to work!

I modified demo.css with the following...

img 
{       
    background: transparent;     
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; 
    /* IE8 */     
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   
    /* IE6 & 7 */     
    zoom: 1; 
}

and now my problem is solved.

Mottie commented 12 years ago

Oh nice! Thanks for sharing... I always forget about the MS filters =/