[Seaside] Image Zoomer: How to capture mouseOver X & Y

dirk newbold dirkdirk at gmail.com
Fri Mar 19 06:16:45 UTC 2010


Hi,

I'm trying to replicate an image zoomer as per
http://www.magictoolbox.com/magiczoom/

I've been able to display the zoomed image (position: relative; width:
1000px;) within a clipped div (overflow: hidden; width: 400px;) and
move that image around with up, down, left, right anchors which just
control the style (left: Xpx; top: Ypx;) of the relatively positioned
zoomed image.

Something like:

renderImageZoom
	html div class: 'imageZoomHolder'; with: [
		html div id: self zoomId; class: 'imageZoomClipped'; with: [
			self renderImageZoomerUnClipped: html ].

renderImageZoomUnClipped: html
	html div
		class: 'imageZoomUnClipped';
		style: self cssClippedPosition;     "this is where the X & Y are fed
into the css"
		with: [ html image url: someUrl ]

This works nicely but I haven't been able to work out to to pass the
relative X & Y positions from the mouseover on the original image into
the cssClippedPosition method.

Any ideas?

Cheers,

Dirk


More information about the seaside mailing list