PDA

View Full Version : Frame/boarder around feature photo


kriyababaji
Aug-27-2006, 01:33 PM
Greetings

Lets say a viewer was in standard smugmug view style (but really any view style), how could I have the primary/selected photo they were viewing (not all thumbs) display with a white boarder? I want to have the viewer see what the image would look like if it were framed. All the thumbs would appear without a boarder, until they were selected then they would appear with a boarder as the feature photo.

Hope that's clear, thanks for any insight, shane

javier.rinaldi
Aug-27-2006, 03:09 PM
Greetings

Lets say a viewer was in standard smugmug view style (but really any view style), how could I have the primary/selected photo they were viewing (not all thumbs) display with a white boarder? I want to have the viewer see what the image would look like if it were framed. All the thumbs would appear without a boarder, until they were selected then they would appear with a boarder as the feature photo.

Hope that's clear, thanks for any insight, shane

Mike Lane recently made a post about making frames and corner effects by creating a custom watermark. check out his post here. http://dgrin.com/showpost.php?p=371581&postcount=66

Mike Lane
Aug-27-2006, 11:10 PM
Mike Lane recently made a post about making frames and corner effects by creating a custom watermark. check out his post here. http://dgrin.com/showpost.php?p=371581&postcount=66:thumb

You could also use CSS to put a border around the image. The displayed image is contained within a div that you could also give a border to so you could get an interesting double matte effect, or a matte and frame effect. If you're interested give this thread a bump and we can get some examples going.

kriyababaji
Aug-28-2006, 09:49 AM
Hi Mike

We figured out how to do the single mat effect. How could we achieve a double mat/frame effect?

thanks for your ideas, shane

:thumb

You could also use CSS to put a border around the image. The displayed image is contained within a div that you could also give a border to so you could get an interesting double matte effect, or a matte and frame effect. If you're interested give this thread a bump and we can get some examples going.

Mike Lane
Aug-28-2006, 02:08 PM
This'll add a 5 px green "frame" around your image:

#smugmug_small #displayPhoto .photo,
#smugmug #displayPhoto .photo {float:left; border:5px solid #080;}
#smugmug_small #displayPhoto #imageInfo,
#smugmug_small #displayPhoto #imageInfo {clear:both;}

This is only for the smugmug and smugmug small styles and I'm quite sure this will cause some problems in IE. You'll probably notice that your image gets pushed down to the next line below the thumbnails (just a guess but I'm pretty sure). The only way that you're really going to be able to solve this is to adjust the width of the div.rightColumn and the div#smugmug. But the amount that you're going to have to increase it by will vary depending on the sum of the widths of the left and right borders. So fix the photo borders to look how you want them and then come back to get help with the broken-ness of the page in IE.