search

fredleblanc / roundabout

A 3D Turntable jQuery Plugin.
645 stars 203 forks source link

using background images for li elements doesn't get scaled #59

Closed bnowacky closed 12 years ago

bnowacky commented 12 years ago

If you use a background image on the li element, it gets cropped when moved to positions other than in-focus. With my layout, I need to use background images rather than regular images in the li, but can't seem to see anyway to make this work.

fredleblanc commented 12 years ago

If you want to use background images, you'll want to set background-size in CSS. Keep in mind that this property isn't supported well in non-current versions of IE. Otherwise, you can set "background images" as normal inline images that are positioned absolutely, width 100%, z-indexed below the rest of your content.

bnowacky commented 12 years ago

Tried that, but as soon as you drag the in-focus element away, it jumps immediately to roundabout-moveable-item, and looks horrible. There's no in-between state of 'animating' or 'moving'....

bnowacky commented 12 years ago

conversely, if the images to the left and right of 'in-focus' had an alternate style element the background-image size element would be perfect.

bnowacky commented 12 years ago

FWIW, this made it work:

Ln 499: 'background-size': factors.width + "px " + factors.height + "px", Doesn't cause any choppy animation either. Not sure if that's what you meant with your original suggestion, but works like a charm :)

Thanks for the help !

fredleblanc commented 12 years ago

Not what I meant, but hey, if it works, it works! :)