title: Slick slider. Why do artifacts appear when slide from last to first and from first to last?
body: <p>Why do artifacts appear when slide from last to first and from first to last? I tried with Swiper slider, but it was the same. Is it because of large images or what? If you deactivate infinity, everything will be okay, but I need infinity.</p>
  
  <p>Here is the JS-code:</p>
  
  <pre><code>var simpleSliderInner = $(".simple-slider__inner");
  
  simpleSliderInner.slick({
    prevArrow: "&lt;button class=\"simple-slider__arrow simple-slider__arrow_prev\"&gt;" +
    "&lt;svg class=\"icon icon_sprite_arrow_slider\"&gt;" +
    "&lt;use xmlns:xlink=\"http://www.w3.org/1999/xlink\" xlink:href=\"#sprite_arrow_slider\"&gt;&lt;/use&gt;" +
    "&lt;/svg&gt;" +
    "&lt;/button&gt;",
    nextArrow: "&lt;button class=\"simple-slider__arrow simple-slider__arrow_next\"&gt;" +
    "&lt;svg class=\"icon icon_sprite_arrow_slider\"&gt;" +
    "&lt;use xmlns:xlink=\"http://www.w3.org/1999/xlink\" xlink:href=\"#sprite_arrow_slider\"&gt;&lt;/use&gt;" +
    "&lt;/svg&gt;" +
    "&lt;/button&gt;",
    dots: true,
    dotsClass: "simple-slider__dots",
    responsive: [
      {
        breakpoint: 1024,
        settings: {
          arrows: false
        }
      }
    ]
  });
  </code></pre>
  
  <p><a href="https://codepen.io/SilencerWeb/pen/XebvJw?editors=1010" rel="nofollow noreferrer">Here is codepen.</a></p>
  
  <p><a href="http://silencer.website/tomatdesign/one-project.html" rel="nofollow noreferrer">Here is website</a></p>