Panzoom: рдлрд╝реЛрдХрд▓ рдкреЙрдЗрдВрдЯ рдорд╛рдЙрд╕рд╡реНрд╣реАрд▓ рдЬрд╝реВрдорд┐рдВрдЧ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдореЗрдВ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ

рдХреЛ рдирд┐рд░реНрдорд┐рдд 4 рд╕рд┐рддре░ 2013  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: timmywil/panzoom

рдореИрдВрдиреЗ рдореИрдХ рдФрд░ рдкреАрд╕реА рдкрд░ рдПрдлрдПрдл рдореЗрдВ рдореВрд╕рд╡реНрд╣реАрд▓ рдлреЛрдХрд▓ рдкреНрд╡рд╛рдЗрдВрдЯ рдЬрд╝реВрдорд┐рдВрдЧ рдбреЗрдореЛ (http://timmywil.github.io/jquery.panzoom/demo/) рдХреА рдХреЛрд╢рд┐рд╢ рдХреА рд╣реИ рдФрд░ рдпрд╣ рдпрд╛ рддреЛ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИред рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ mousewheel.focal рдИрд╡реЗрдВрдЯ рдЯреНрд░рд┐рдЧрд░ рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЬрд╛ рд░рд╣рд╛ рд╣реИ/рдЙрдард╛рдпрд╛ рдирд╣реАрдВ рдЬрд╛ рд░рд╣рд╛ рд╣реИ

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдирдорд╕реНрддреЗ

рдЗрддрдиреЗ рдкреБрд░рд╛рдиреЗ рд╡рд┐рд╖рдп рдХреЛ рдЫреВрдиреЗ рдХреЗ рд▓рд┐рдП рдЦреЗрдж рд╣реИред рдирд╡реАрдирддрдо рд╕рдВрд╕реНрдХрд░рдг рдЗрд╕ рдкреНрд▓рдЧрдЗрди рдХреЗ рдмрд┐рдирд╛ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдореЗрдВ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИред рдореБрдЭреЗ рдпрд╣ рддрдм рддрдХ рдирд╣реАрдВ рдкрддрд╛ рдерд╛ рдЬрдм рддрдХ рдореБрдЭреЗ рдпрд╣ рдореБрджреНрджрд╛ рдирд╣реАрдВ рдорд┐рд▓рд╛ред рдореБрдЭреЗ рдХреЗрд╡рд▓ рдпрд╣ рд╕рдорд╕реНрдпрд╛ рдорд┐рд▓реА рдХреНрдпреЛрдВрдХрд┐ .bowerrc рдкрд░ рдПрдХ рдХрдорд┐рдЯрдореЗрдВрдЯ рдкрд┐рдЫрд▓реЗ 3 рд╡рд░реНрд╖реЛрдВ рдореЗрдВ рдПрдХрдорд╛рддреНрд░ рдХрдорд┐рдЯ рдерд╛ рдЬреЛ рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рдВрджрд░реНрдн рджреЗрддрд╛ рд╣реИ (рдФрд░ рд░реЗрдкреЛ рдлреНрд░рдВрдЯрдкреЗрдЬ рд╕реЗ рджрд┐рдЦрд╛рдИ рджреЗрддрд╛ рд╣реИ)

рдХреНрдпрд╛ рдПрдлрдПрдХреНрдпреВ рдореЗрдВ рдпрд╣ рдЬреЛрдбрд╝рдирд╛ рдЙрдкрдпреЛрдЧреА рд╣реЛрдЧрд╛ рдХрд┐ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдореЗрдВ рдХрд╛рдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП https://github.com/jquery/jquery-mousewheel рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ? (рдпрд╛ рдореИрдВ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдЕрдВрдзрд╛ рд╣реЛ рд░рд╣рд╛ рд╣реВрдБ?)

рдХреЛрдбрдкреЗрди рдЙрджрд╛рд╣рд░рдг: http://codepen.io/viion/pen/eBaVzN

рд╕рднреА 3 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

рдЕрджреНрдпрддрди: рдореИрдВрдиреЗ рдХреБрдЫ рдЧреБрдЧрд▓ рдХрд┐рдпрд╛ рдФрд░ рдпрд╣ рдкрддрд╛ рдЪрд▓рд╛ рдХрд┐ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдХреЛ DOMMouseScroll рдШрдЯрдирд╛ рдХреЛ рд╕реБрдирдиреЗ рдХреА рдЬрд░реВрд░рдд рд╣реИ рдФрд░ рдореИрдВрдиреЗ рдкрд╛рдпрд╛ рдХрд┐ рдореВрд▓ рдШрдЯрдирд╛ рдХреЛ рдкрд╛рд░рд┐рдд рдХрд░рдиреЗ рдХреЗ рдмрдЬрд╛рдп рдпрд╣ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рдЕрдЧрд░ рдореИрдВрдиреЗ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдИрд╡реЗрдВрдЯ рдХреЗ рдЖрдзрд╛рд░ рдкрд░ рдСрдмреНрдЬреЗрдХреНрдЯ рдмрдирд╛рдпрд╛ рд╣реИ, рддреЛ рдХреЙрдлрд╝реАрд╕реНрдХреНрд░рд┐рдкреНрдЯ рдореЗрдВ I рдЗрд╕реЗ рдХрд┐рдпрд╛:

        jquery(@selector).on 'mousewheel.focal', (e) =>
            onMouseWheel.call(@, e)


        #FF specific mouse wheel support
        jquery(@selector).on 'DOMMouseScroll', (e) =>
            onMouseWheel.call(@, e)

    onMouseWheel = (e) ->
        e.preventDefault()

        delta = e.originalEvent.wheelDelta
        focalPoint = e
        if delta is undefined
            delta = e.originalEvent.detail
            focalPoint =
                clientX: e.originalEvent.clientX
                clientY: e.originalEvent.clientY

        logger.debug "delta=#{delta}", @

        @$elem.panzoom 'zoom', delta < 0,
            increment: settings.ZOOM_INCREMENT
            focal: focalPoint

рдореИрдВрдиреЗ рдПрдлрдПрдл рдкрд░ рдЬрд╝реВрдо рдХрд░рддреЗ рд╕рдордп рдХреБрдЫ рдЕрдЬреАрдм рдЧреНрд░рд╛рдлрд┐рдХрд▓ рдЧреНрд▓рд┐рдЪ рджреЗрдЦреЗ рд╣реИрдВ рдЬрд╣рд╛рдВ рдПрд╕рд╡реАрдЬреА рдмрд╛рдШ рдЬрд╝реВрдорд┐рдВрдЧ рдХреЗ рджреМрд░рд╛рди рдПрдХ рд╕реЗрдХрдВрдб рдХреЗ рд▓рд┐рдП 4 рдХреНрд╡рд╛рдбреНрд░рдВрдЯ рдореЗрдВ рд╡рд┐рднрд╛рдЬрд┐рдд рд╣реЛ рдЬрд╛рддрд╛ рд╣реИ - рд▓реЗрдХрд┐рди рдпрд╣ рдЕрдиреНрдп рдбреЗрдореЛ рдХреЛ рднреА рдкреНрд░рднрд╛рд╡рд┐рдд рдХрд░рддрд╛ рд╣реИ, рдЗрд╕рд▓рд┐рдП рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдореЛрдЬрд╝рд┐рд▓рд╛ рдиреЗ рдПрд╕рд╡реАрдЬреА рдХреА рд╡реНрдпрд╛рдЦреНрдпрд╛ рдХрд░рдиреЗ рдХреЗ рдлрдВрдХреА рддрд░реАрдХреЗ рдХрд╛ рдПрдХ рд╕рд╛рдЗрдб рдЗрдлреЗрдХреНрдЯ рд╣реИред рд╡рд┐рдирд┐рд░реНрджреЗрд╢ (рдЕрд░реНрдерд╛рдд рдЕрдиреНрдп рд╕рднреА рдмреНрд░рд╛рдЙрдЬрд╝рд░реЛрдВ рдХреЗ рд▓рд┐рдП рдЕрд▓рдЧ)

рд╢рд╛рдпрдж рдПрдлрдПрдл рдХрд╛ рд╕рдорд░реНрдерди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдбреЗрдореЛ рдкреЗрдЬ рдХреЛ рдЕрдкрдбреЗрдЯ рдХрд░рдиреЗ рд▓рд╛рдпрдХ рд╣реЛред

рдзрдиреНрдпрд╡рд╛рдж, рдореИрдВ рдбреЗрдореЛ рдкреЗрдЬ рдХреЛ рдЕрдкрдбреЗрдЯ рдХрд░реВрдВрдЧрд╛ред

рдирдорд╕реНрддреЗ

рдЗрддрдиреЗ рдкреБрд░рд╛рдиреЗ рд╡рд┐рд╖рдп рдХреЛ рдЫреВрдиреЗ рдХреЗ рд▓рд┐рдП рдЦреЗрдж рд╣реИред рдирд╡реАрдирддрдо рд╕рдВрд╕реНрдХрд░рдг рдЗрд╕ рдкреНрд▓рдЧрдЗрди рдХреЗ рдмрд┐рдирд╛ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдореЗрдВ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИред рдореБрдЭреЗ рдпрд╣ рддрдм рддрдХ рдирд╣реАрдВ рдкрддрд╛ рдерд╛ рдЬрдм рддрдХ рдореБрдЭреЗ рдпрд╣ рдореБрджреНрджрд╛ рдирд╣реАрдВ рдорд┐рд▓рд╛ред рдореБрдЭреЗ рдХреЗрд╡рд▓ рдпрд╣ рд╕рдорд╕реНрдпрд╛ рдорд┐рд▓реА рдХреНрдпреЛрдВрдХрд┐ .bowerrc рдкрд░ рдПрдХ рдХрдорд┐рдЯрдореЗрдВрдЯ рдкрд┐рдЫрд▓реЗ 3 рд╡рд░реНрд╖реЛрдВ рдореЗрдВ рдПрдХрдорд╛рддреНрд░ рдХрдорд┐рдЯ рдерд╛ рдЬреЛ рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рдВрджрд░реНрдн рджреЗрддрд╛ рд╣реИ (рдФрд░ рд░реЗрдкреЛ рдлреНрд░рдВрдЯрдкреЗрдЬ рд╕реЗ рджрд┐рдЦрд╛рдИ рджреЗрддрд╛ рд╣реИ)

рдХреНрдпрд╛ рдПрдлрдПрдХреНрдпреВ рдореЗрдВ рдпрд╣ рдЬреЛрдбрд╝рдирд╛ рдЙрдкрдпреЛрдЧреА рд╣реЛрдЧрд╛ рдХрд┐ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдореЗрдВ рдХрд╛рдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП https://github.com/jquery/jquery-mousewheel рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ? (рдпрд╛ рдореИрдВ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдЕрдВрдзрд╛ рд╣реЛ рд░рд╣рд╛ рд╣реВрдБ?)

рдХреЛрдбрдкреЗрди рдЙрджрд╛рд╣рд░рдг: http://codepen.io/viion/pen/eBaVzN

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

jsblanco picture jsblanco  ┬╖  19рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

timmywil picture timmywil  ┬╖  10рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

YuriGor picture YuriGor  ┬╖  12рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

nsshunt picture nsshunt  ┬╖  20рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

kylegoines picture kylegoines  ┬╖  4рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ