On the following demo website for the jQuery cycle plugin, all the images that are presented have a white round edged border, presenting the photo in a similar way to a polaroid photo.

http://www.malsup.com/jquery/cycle/

However, on my Drupal website, the transitions occur fine, yet the images are RAW, and do not have the nice polaroid style border shown in the demo site. I can apply ImageCache presets, but how do I get the standard polaroid look from the demo site?

I am using:
6.x-3.0-alpha3

Comments

jponch’s picture

jponch commented

On the malsup.com demo page they're adding that padding, background color and border with simple CSS. If you take a look at their CSS it's basically:

.pics img { height: 200px; width: 200px; padding: 15px; border: 1px solid #ccc; background-color: #eee; top:0; left:0 }
.pics img { -moz-border-radius: 10px; -webkit-border-radius: 10px; }

So on your site you might use something like:

.views-field-field-image-field-name-fid img or whatever your markup is giving you. Make sense?