for www.thegreenskirt.nl I used a frame.gif placed above the thumbs for the album.page and jquery curvy corners for the image pages.
for jquery I had to use two divs to get it it working, one which has the (rounded) image a background (c2) and the second (c3) above it to get a border.
<div class="container" style="width:<?php print (getDefaultwidth());?>px;height:<?php print (getDefaultHeight());?>px;">
<div class="c3" style="position:relative;top:0px;left:0px;float:left;width:<?php print (getDefaultwidth())-4;?>px;height:<?php print (getDefaultHeight())-40;?>px;background:#ccc;border:6px solid #ccc;">
</div>
<div class="c2" style="z-index:999;position:absolute;left:0px;margin-left:84px;margin-top:0px;float:left;width:<?php print (getDefaultwidth());?>px;height:<?php print (getDefaultHeight())-40;?>px;background: url(<?php echo $image; ?>);background-repeat:no-repeat;border:0px solid #ccc;padding:0px;">
</div>
</div>
<script type="text/javascript">
$(document).ready(
function()
{
$('.c2').corner({
tl: { radius: 16 },
tr: { radius: 16 },
bl: { radius: 16 },
br: { radius: 16 },
antiAlias: true,
autoPad: true,
validTags: ["div"] });
$('.c3').corner({
tl: { radius: 20 },
tr: { radius: 20 },
bl: { radius: 20 },
br: { radius: 20 },
antiAlias: true,
autoPad: true,
validTags: ["div"] });
});
</script>
it works in all browsers excecpt tha of msie doesn't anti-aliaze nice because of it's png limitation. (ie7 does)