O'Reilly logo

Learning AngularJS by Brad Dayley

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Implementing Event Handlers in a Custom Directive

Another very common use of custom directives is to implement event handlers to interact with mouse and keyboard events that are occurring in the custom elements. This enables you to provide enhanced user interactions to the custom elements.

In this example we will add mouse event handlers that enable you to use drag operations on images to resize and adjust the opacity. When the mouse is dragged left the image shrinks; right, the image enlarges; up, the image fades; and down, the opacity increases. For this example, I have included the full version of jQuery by loading it in the AngularJS template. I chose to do so to use some capabilities like getting the image width() that is not available in ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required