In Elm, how can I detect the mouse position relatively to an html element?

Is possible to detect the mouse position with mouseMove event. This is an example of how it can be implemented using The Elm Architecture.

The view:

view : Model -> Html Msg
view model =
    div []
        [ img
            [ on "mousemove" (Decode.map MouseMove decoder)
            , src "http://..."
            ]
            []
        ]

The decoder:

decoder : Decoder MouseMoveData
decoder =
    map4 MouseMoveData
        (at [ "offsetX" ] int)
        (at [ "offsetY" ] int)
        (at [ "target", "offsetHeight" ] float)
        (at [ "target", "offsetWidth" ] float)

The type alias

type alias MouseMoveData =
    { offsetX : Int
    , offsetY : Int
    , offsetHeight : Float
    , offsetWidth : Float
    }

And the Message

type Msg
    = MouseMove MouseMoveData

And this is how the data arrive to the Update:

update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        MouseMove data ->
            -- Here you can use your "data", updating
            -- the model with it, for example
            ( { model | zoomMouseMove = Just data }, Cmd.none )

This is a library that does a similar thing: http://package.elm-lang.org/packages/mbr/elm-mouse-events/1.0.4/MouseEvents