Image overlay on thumbnails?

[garvinhicking]

Hi!

Basically, doesn't lightbox perform this kind of checking for large versions? You could use that magic to add your overlay image, instead of the lightbox default of only adding an onclick handler?

Regards,
Garvin

[garvinhicking]

Hi!

But what lightbox does is this:

- Walk the DOM tree
- Check for <img> references
- Check if an <a> surrounds them
- If so, enhance the <a> so that an attribute is injected into the DOM tree, which will onclick-embedded content within the same page

And what I gather you want:

- Walk the DOM tree
- Check for <img> references
- Check if an <a> surrounds them
- If so, enhance the <a> so that a second <img> is injected into the DOM tree, which will overlay the current content with a "Thumbnail here" image?

So you should be able to use much of that Javascript, and only modify it to inject a XML tag instead of an XML attribute to the DOM Tree?

Regards,
Garvin

[dk70]

http://cssglobe.com/lab/imagelink/ seems to work when I tried it briefly yesterday. I used Greybox and Lightbox2. Go to http://cssglobe.com/post/1238/style-your-image-links for introduction and things to fix, see comments - the position:relative tip is needed for IE.

[abdussamad]

This doesn't solve your problem but it does improve slightly on your existing setup. I just tried it for the fun of it. Basically you open up functions_images.inc.php in the includes folder of your s9y installation and locate this line in the function serendipity_resize_image_gd:

Code: Select all

imagecopyresampled($out, $in, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);

Then add the watermarking code after that line:

Code: Select all

   /*custom mod*/
    $watermark = imagecreatefrompng('path\to\watermark.png');
    $watermark_width = imagesx($watermark);  
	$watermark_height = imagesy($watermark);
	$dest_x = $newwidth - $watermark_width - 5;  
	$dest_y = $newheight - $watermark_height - 5;
	
	imagecopymerge($out, $watermark, $dest_x, $dest_y, 0, 0, $watermark_width, $watermark_height, 100);
	//end custom mod

Then you navigate to your uploads dir and delete all the serendipitythumb files with a rm *serendipityThumb*. Then go to the admin panel and click on rebuild thumbs and you should have your watermarked thumbnails.

Of course since its in the image resize function it will also apply the watermark to resized or cropped images. But since the watermarked images are stored as files you have your caching