<?xml version="1.0" encoding="utf-8" ?><rss version="2.0" xmlns:tt="http://teletype.in/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:media="http://search.yahoo.com/mrss/"><channel><title>@vblog</title><generator>teletype.in</generator><description><![CDATA[@vblog]]></description><link>https://teletype.in/@vblog?utm_source=teletype&amp;utm_medium=feed_rss&amp;utm_campaign=vblog</link><atom:link rel="self" type="application/rss+xml" href="https://teletype.in/rss/vblog?offset=0"></atom:link><atom:link rel="next" type="application/rss+xml" href="https://teletype.in/rss/vblog?offset=10"></atom:link><atom:link rel="search" type="application/opensearchdescription+xml" title="Teletype" href="https://teletype.in/opensearch.xml"></atom:link><pubDate>Mon, 21 Sep 2026 05:48:08 GMT</pubDate><lastBuildDate>Mon, 21 Sep 2026 05:48:08 GMT</lastBuildDate><item><guid isPermaLink="true">https://teletype.in/@vblog/WSCQqQI6U</guid><link>https://teletype.in/@vblog/WSCQqQI6U?utm_source=teletype&amp;utm_medium=feed_rss&amp;utm_campaign=vblog</link><comments>https://teletype.in/@vblog/WSCQqQI6U?utm_source=teletype&amp;utm_medium=feed_rss&amp;utm_campaign=vblog#comments</comments><dc:creator>vblog</dc:creator><title>Slick Slider: Рецепты, конфиг</title><pubDate>Wed, 28 Apr 2021 16:05:33 GMT</pubDate><description><![CDATA[Подключение слайдера (типичный конфиг с респонзитивностью):]]></description><content:encoded><![CDATA[
  <p>Подключение слайдера (типичный конфиг с респонзитивностью):</p>
  <pre>$(&#x27;.slider1__container&#x27;).slick(
    {
    	infinite: true, // бесконечные слайды
    	slidesToShow: 3, // сколько слайдов показать
    	slidesToScroll: 1, // сколько слайдов переключать за раз
    	arrows: false, // точки снизу
    	speed: 300, // скорость переключения слайдов

    	responsive: [
    		{
    			breakpoint: 992, // lg
    			settings: {
					slidesToShow: 3,
					slidesToScroll: 1,
					infinite: true,
				}
    		},
    		{
    			breakpoint: 768, //md
				settings: {
					slidesToShow: 2,
					slidesToScroll: 1,
					infinite: true,
					centerMode: true // 
				}
    		},
    		{
    			breakpoint: 576, // sm
				settings: {
					slidesToShow: 1,
					slidesToScroll: 1,
					infinite: true,
					centerMode: true
				}
    		}
    	]
    }
    );

    // Ресайзим слайдер при изменении ширины страницы
    $(window).resize(function() {
		$(&#x27;.slider1__container&#x27;).slick(&#x27;resize&#x27;);
	})

    // Кастомные контролы
    $(&#x27;.slider1__controls .next&#x27;).click(function(){
		$(&#x27;.slider1__container&#x27;).slick(&#x27;slickNext&#x27;);
	})
	$(&#x27;.slider1__controls .prev&#x27;).click(function(){
		$(&#x27;.slider1__container&#x27;).slick(&#x27;slickPrev&#x27;);
	})</pre>
  <p>Для того чтобы слайдер работал корректно, нужно следить чтобы элементы слайдера были свёрстаны ровно и по текущему канону (с использованием flex). Сначала нужно проверить, чтобы блоки корректно отображались вне слайдера а потом уже можно переносить их в слайдер.</p>

]]></content:encoded></item></channel></rss>