In this example, the
Uize.Util.Coupler class, so that the values of the
Uize.Util.Coupler class is easy: all you have to do is create an instance of it, specifying which properties of which instances you would like to be coupled together. This example demonstrates coupling two instances, but the
Uize.Util.Coupler class supports coupling an arbitrary number of instances.
Now, the widget on the left uses a low resolution image and stretches it larger for the zoomed in effect. The widget on the right uses a high resolution image. By coupling the two widgets together so that the one drives the other, you can inspect the zoomed in image on both sides at once, and you can compare them region by region to see the affect of the browser's image stretching process. Load this example in different browsers to see how the image stretching of different browsers stack up. Finally, a checkbox is provided to easily activate or de-activate the coupling of the two instances. Try interacting with the widgets in both modes: coupled, and decoupled.