add_propertyChanged(function(sender, e)) propertyChanged.add(function(sender, e)) remove_propertyChanged(function(sender, e)) propertyChanged.remove(function(sender, e))
Most of the properties of this ImageViewer will fire the PropertyChanged event when the value changes. When this happens, the value of PropertyChangedEventArgs.PropertyName of the event data will be set to the name of the property that was changed. For example, the PropertyChangedEventArgs.PropertyName will be set to "ScaleFactor" when ScaleFactor changes and "ScrollOffset" when ScrollOffset changes.
Start with the ImageViewer example, remove all the code inside the example function (search for the "// TODO: add example code here" comment) and insert the following code:
Open the HTML page in your browser, now as after you click the Example button and whenever you pan or zoom the image, the values are displayed in the label.
example: function SiteLibrary_DefaultPage$example(viewer) { var exampleLabel = document.getElementById("exampleLabel"); // Hook to the property changed event of the viewer viewer.add_propertyChanged(function(sender, e) { // Check the property name, we are interested in "ScaleFactor" and "ScrollOffset" var propertyName = e.get_propertyName(); if(propertyName == "ScaleFactor" || propertyName == "ScrollOffset") { exampleLabel.textContent = propertyName + "Changed"; } }); },
Parameter | Type | Description |
---|---|---|
sender | 'var' | The source of the event. |
e | PropertyChangedEventArgs | The event data. |