Ngx-drag-scroll: рдореЗрдердб рдореВрд╡рд░рд╛рдЗрдЯ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ рдпрд╛ RTL рд╕рдкреЛрд░реНрдЯ рдЗрд╢реНрдпреВрдЬ

рдХреЛ рдирд┐рд░реНрдорд┐рдд 19 рдЬреВрди 2018  ┬╖  11рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: bfwg/ngx-drag-scroll

  • рдореИрдВ рдПрдХ рдЬрдорд╛ рдХрд░ рд░рд╣рд╛ рд╣реВрдБ ...

    • [рдПрдХреНрд╕] рдмрдЧ рд░рд┐рдкреЛрд░реНрдЯ

  • рд╡рд░реНрддрдорд╛рди рд╡реНрдпрд╡рд╣рд╛рд░ рдХреНрдпрд╛ рд╣реИ?
    рдореЗрд░реЗ рдкрд╛рд╕ рдПрдХ рдореБрджреНрджреЗ рдХреА рд░рд┐рдкреЛрд░реНрдЯ рдФрд░ рдкреВрдЫрдиреЗ рдХреЗ рд▓рд┐рдП рдПрдХ рдкреНрд░рд╢реНрди рд╣реИред
    1- рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ currIndex рдХреЛ рдЧрд▓рддреА рд╕реЗ рд╕рд░рдгреА рд╕реАрдорд╛ рд╕реЗ рдмрд╛рд╣рд░ рд╕реЗрдЯ рдХрд░ рджрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ рдлрд╝рдВрдХреНрд╢рди CurrentChildWith (рд▓рд╛рдЗрди 274) рдореЗрдВ рдФрд░ рдЗрд╕реЗ length - 1 рд╕реЗрдЯ рдХрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдП - рдареАрдХ рдЙрд╕реА рддрд░рд╣ рдЬреИрд╕реЗ рдХрд┐ рд╕реНрдЯреЗрдЯрдореЗрдВрдЯ рдХреА рд╕реНрдерд┐рддрд┐ -. рдпрд╣ рд░реБрдХ рдЬрд╛рддрд╛ рд╣реИ рджрд╛рдПрдБ рдЪрд▓рдирд╛
    2- рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ RTL рд╕рдорд░реНрдерди рдХреЗ рд╕рд╛рде рдмрд╣реБрдд рд╕рд╛рд░реА рд╕рдорд╕реНрдпрд╛рдПрдВ рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ reachesRightBound рд╢реБрд░реБрдЖрдд рдореЗрдВ рдЭреВрдард╛ рдЙрддреНрд╕рд░реНрдЬрд┐рдд рдХрд░рддрд╛ рд╣реИ рдФрд░ moveLeft рдмрд╛рдПрдВ рдмрд╛рдЙрдВрдб рддрдХ рдкрд╣реБрдВрдЪрдиреЗ рдХреЗ рдмрд╛рдж рднреА рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рд▓реЗрдХрд┐рди рдпрд╣ рд╕рдорд╛рди рдирд╣реАрдВ рд╣реИ рд╕рд╣реА рдмрд╛рдзреНрдпред

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

рд╣рд╛рдп @MortezaT , рджреЗрд░реА рд╕реЗ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдХреЗ рд▓рд┐рдП рдЦреЗрдж рд╣реИред рдХреНрдпрд╛ рдЖрдк рдореБрдЭреЗ рдХреБрдЫ рдкреБрдирд░реБрддреНрдкрд╛рджрд┐рдд рдХрджрдо рдФрд░ рдЙрдкрдпреЛрдЧ рдХрд╛ рдорд╛рдорд▓рд╛ рджреЗ рд╕рдХрддреЗ рд╣реИрдВ рддрд╛рдХрд┐ рдореИрдВ рдХрд░реАрдм рд╕реЗ рджреЗрдЦ рд╕рдХреВрдВ? рдзрдиреНрдпрд╡рд╛рдж!

рд╣рд╛рдп @bfwg , рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рджред
рд╡рд░реНрддрдорд╛рди рдореЗрдВ рдореИрдВ рдХреБрдЫ рдЕрдиреНрдп рдЪреАрдЬреЛрдВ рдореЗрдВ рдХрд╛рдлреА рд╡реНрдпрд╕реНрдд рд╣реВрдВ, рд▓реЗрдХрд┐рди рдореИрдВ рдЗрд╕реЗ рдЬрд▓реНрдж рд╕реЗ рдЬрд▓реНрдж рдХрд░реВрдВрдЧрд╛ред

рдХреЛрдИ рд╕рдорд╕реНрдпрд╛ рдирд╣реАрдВ рдЕрдкрдирд╛ рд╕рдордп рд▓реЗ рд▓реЛред

рдпрд╣рд╛рдВ рдЖрдк рдореЗрд░рд╛ рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рджреЗрдЦ рд╕рдХрддреЗ рд╣реИрдВред рдореБрдЭреЗ рдЙрдореНрдореАрдж рд╣реИ рдХрд┐ рдЗрд╕рд╕реЗ рд╕рдорд╕реНрдпрд╛ рдореЗрдВ рдорджрдж рдорд┐рд▓реЗрдЧреАред

рдирдорд╕реНрддреЗ @MortezaT , 2.0.0-рдмреАрдЯрд╛.2 рдЖ рдЧрдпрд╛ рд╣реИ, рдореБрдЭреЗ рдмрддрд╛рдПрдВ рдХрд┐ рдЗрд╕рдиреЗ рдЖрдкрдХреЗ рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдХреЗ рдореБрджреНрджреЗ рдХреЛ рд╕рдмрд╕реЗ рдЦрд░рд╛рдм рдпрд╛ рдмреЗрд╣рддрд░ рдмрдирд╛ рджрд┐рдпрд╛ рд╣реИред рдзрдиреНрдпрд╡рд╛рдж!

рди рддреЛ рдмреАрдЯрд╛.2 рдФрд░ рди рд╣реА рдмреАрдЯрд╛.3 рдиреЗ рдмрд┐рд▓реНрдХреБрд▓ рдХрд╛рдо рдХрд┐рдпрд╛ред
рд╡реЗ рджреЛрдиреЛрдВ рддреНрд░реБрдЯрд┐ рдХреЗ рд╕рд╛рде рдЖрддреЗ рд╣реИрдВ рдЬреЛ рдмрддрд╛рддрд╛ рд╣реИ рдХрд┐ рдЗрд╕реЗ рдХреЛрдгреАрдп рджреНрд╡рд╛рд░рд╛ рдирд╣реАрдВ рдкрд╣рдЪрд╛рдирд╛ рдЧрдпрд╛ рд╣реИред рдпрд╣рд╛рдБ рддреНрд░реБрдЯрд┐ рд╣реИ:

 Can't bind to 'scrollbar-hidden' since it isn't a known property of 'div'.

рдХреНрдпрд╛ рдореБрдЭрд╕реЗ рдХреБрдЫ рдЫреВрдЯрд╛?

рдирдорд╕реНрддреЗ @MortezaT , 2.0.0 drag-scroll рдХрд╛ рдЙрдкрдпреЛрдЧ div рдХреЗ рдмрдЬрд╛рдп рд╣рд┐рдВрдбреЛрд▓рд╛ рд╣реЛрд╕реНрдЯ рддрддреНрд╡ рдХреЗ рд░реВрдк рдореЗрдВ рдХрд░рддрд╛ рд╣реИред рд╕рд╛рде рд╣реА, рдмрд╛рд▓ рддрддреНрд╡реЛрдВ рдХреЛ рдЪрд┐рд╣реНрдирд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП, рд╣рдореЗрдВ drag-scroll-item рдирд┐рд░реНрджреЗрд╢ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИред

  <drag-scroll>
    <img drag-scroll-item src="some-url" />
    <img drag-scroll-item src="some-url" />
    <img drag-scroll-item src="some-url" />
  </drag-scroll>

рдЕрдзрд┐рдХ рдЬрд╛рдирдХрд╛рд░реА README.md рдореЗрдВ рдорд┐рд▓ рд╕рдХрддреА рд╣реИред

рдЪреАрдпрд░реНрд╕ред

рд╣рд╛рдп @bfwg рдзрдиреНрдпрд╡рд╛рджред
рдХреНрдпрд╛ рдирдП рд╕рдВрд╕реНрдХрд░рдг рдХреЗ рд▓рд┐рдП рдХреЛрдИ рджрд╕реНрддрд╛рд╡реЗрдЬ рд╣реИ, рдХреНрдпреЛрдВрдХрд┐ рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╡реЗ рдмрд╣реБрдд рдЕрд▓рдЧ рд╣реИрдВред
рдореБрдЭреЗ рд╕рдордЭ рдирд╣реАрдВ рдЖ рд░рд╣рд╛ рд╣реИ рдХрд┐ 20px рдХреА рдЪреМрдбрд╝рд╛рдИ рдФрд░ рдКрдВрдЪрд╛рдИ рдХреЗ рдЕрд▓рд╛рд╡рд╛ .drag-scroll-content ред

рд╕реНрдХреНрд░реЙрд▓ рдмрд╛рд░ рдХреЛ рдЫрд┐рдкрд╛рдиреЗ рдХреЗ рд▓рд┐рдП, рд╣рдореЗрдВ рдПрдХ рдирдпрд╛ рд░реИрдкрд░ рдбрд┐рд╡ рдмрдирд╛рдирд╛ рд╣реЛрдЧрд╛ рдФрд░ рдкреИрд░реЗрдВрдЯ рдбрд┐рд╡ рдФрд░ рдХреИрд░реЛрд╕реЗрд▓ рдбрд┐рд╡ (.рдбреНрд░реИрдЧ-рд╕реНрдХреНрд░реЙрд▓-рдХрдВрдЯреЗрдВрдЯ) рдХреЗ рдмреАрдЪ рдбрд┐рд╡ рдбрд╛рд▓рдирд╛ рд╣реЛрдЧрд╛ред

рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП:
рдпрд╣ рдПрдХ рд╕рд╛рдорд╛рдиреНрдп рд╣рд┐рдВрдбреЛрд▓рд╛ рд╣реИ
image

рдЬрдм рд╣рдо рд╕реНрдХреНрд░реЙрд▓рдмрд╛рд░ рдХреЛ рдЫрд┐рдкрд╛рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░рддреЗ рд╣реИрдВ, рддреЛ рдХреЛрдИ рдЬрд╛рджреВ рдирд╣реАрдВ рд╣реЛрддрд╛ рд╣реИ! рд╣рдо рдмрд╕ рдПрдХ рд░реИрдкрд░ рдбрд┐рд╡ рдмрдирд╛рддреЗ рд╣реИрдВ, рдФрд░ рдЙрд╕ рд░реИрдкрд░ рдбрд┐рд╡ рдХрд╛ рдЖрдХрд╛рд░ рдХрдВрдЯреЗрдирд░ рдбрд┐рд╡ рдХреЗ рд╕рдорд╛рди рд╕реЗрдЯ рдХрд░рддреЗ рд╣реИрдВ, рд▓реЗрдХрд┐рди рдЗрд╕рдХреА рд╕реНрдХреНрд░реЙрд▓рдмрд╛рд░ рдЪреМрдбрд╝рд╛рдИ/рдКрдВрдЪрд╛рдИ рдШрдЯрд╛рддреЗ рд╣реИрдВред 20px рд╡рд░реНрддрдорд╛рди рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдореЗрдВ рд╕реНрдХреНрд░реЙрд▓рдмрд╛рд░ рдХреА рдКрдВрдЪрд╛рдИ/рд╡рдЬрди рд╣реИред

image

рдЕрдВрдд рдореЗрдВ, рд╣рдо рдХрдВрдЯреЗрдирд░ рдбрд┐рд╡ рдХреЛ рдЕрд▓рдЧ рдХрд░рддреЗ рд╣реИрдВ, рд░реИрдкрд░ рдбрд┐рд╡ рдХреЛ рдкреИрд░реЗрдВрдЯ рдбрд┐рд╡ рд╕реЗ рдЬреЛрдбрд╝рддреЗ рд╣реИрдВ рдФрд░ рдХрдВрдЯреЗрдирд░ рдбрд┐рд╡ рдХреЛ рд╡рд╛рдкрд╕ рд░реИрдкрд░ рдбрд┐рд╡ рдореЗрдВ рдбрд╛рд▓рддреЗ рд╣реИрдВред

image

рдЪреВрдВрдХрд┐ рд░реИрдкрд░ рдХреА рдУрд╡рд░рдлреНрд▓реЛ рд╡рд┐рд╢реЗрд╖рддрд╛ рдХреЛ 'рд╣рд┐рдбрди' рдкрд░ рд╕реЗрдЯ рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ, рд╕реНрдХреНрд░реЙрд▓рдмрд╛рд░ рдЕрдм рдирд╣реАрдВ рджрд┐рдЦрд╛рдП рдЬрд╛рддреЗ рд╣реИрдВред
рдореБрдЭреЗ рдЖрд╢рд╛ рд╣реИ рдХрд┐ рдореЗрд░рд╛ рдбреНрд░рд╛рдЗрдВрдЧ рдХреМрд╢рд▓ рдЕрднреА рднреА рдЦреЗрд▓ рдкрд░ рдирд┐рд░реНрднрд░ рд╣реИ

рдореБрдЭреЗ рдмрддрд╛рдПрдВ рдХрд┐ рдХреНрдпрд╛ рдЖрдкрдХреЗ рдкрд╛рд╕ рдФрд░ рдкреНрд░рд╢реНрди рд╣реИрдВ, рдпрд╛ рдпрджрд┐ рдирдпрд╛ рд╕рдВрд╕реНрдХрд░рдг рдЖрдкрдХреЛ рдХреЛрдИ рд╕рдорд╕реНрдпрд╛ рдкреИрджрд╛ рдХрд░ рд░рд╣рд╛ рд╣реИред

рдзрдиреНрдпрд╡рд╛рдж!

@bfwg
рдзрдиреНрдпрд╡рд╛рджред рдЕрдм рдЗрд╕ рджреГрд╢реНрдп рд╡реНрдпрд╛рдЦреНрдпрд╛ рдХреЗ рд╕рд╛рде рдореЗрд░реЗ рд▓рд┐рдП рд╕рдм рдХреБрдЫ рд╕реНрдкрд╖реНрдЯ рд╣реИ рдФрд░ рдореИрдВ рд╕реНрд╡реАрдХрд╛рд░ рдХрд░рддрд╛ рд╣реВрдВ рдХрд┐ рдпрд╣ рдПрдХ рдЪрддреБрд░ рд╡рд┐рдЪрд╛рд░ рд╣реИред
рдкрд╣рд▓реА рдмрд╛рд░ рдиреЗрд╡рд┐рдЧреЗрд╢рди рдХреЛ рдЫреЛрдбрд╝рдХрд░ рд╕рдм рдХреБрдЫ рдареАрдХ рджрд┐рдЦрддрд╛ рд╣реИред navs рдХрд╛рдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдореБрдЭреЗ рдкрд╣рд▓реЗ рдереЛрдбрд╝рд╛ рд╕рд╛ рдЦреАрдВрдЪрдирд╛ рд╣реЛрдЧрд╛ (рдмрд╕ рдПрдХ рдкреВрд░реА рддрд╕реНрд╡реАрд░ рдирд╣реАрдВ)ред
рдЗрд╕ рдмреАрдЪ рд╡рд┐рдзрд┐ moveRight рдЗрд╕ рд╕рдордп рдХрд╛рдо рдХрд░рддреА рд╣реИ рдФрд░ рд╕реНрдХреНрд░реЙрд▓ рдХреЛ рдмрд╛рдИрдВ рдУрд░ рд▓реЗ рдЬрд╛рддреА рд╣реИ (рдЕрдВрдд)

рдореИрдВ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдмрдВрдж рдХрд░рдиреЗ рдЬрд╛ рд░рд╣рд╛ рд╣реВрдВред рдХреГрдкрдпрд╛ рдореБрдЭреЗ рдмрддрд╛рдПрдВ рдХрд┐ рдХреНрдпрд╛ рдореБрдЭреЗ рдЗрд╕реЗ рдлрд┐рд░ рд╕реЗ рдЦреЛрд▓рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИред рдзрдиреНрдпрд╡рд╛рдж!

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