From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/ru/web/api/element/scrollleft/index.html | 79 ++++++++++++++++++++++++++ 1 file changed, 79 insertions(+) create mode 100644 files/ru/web/api/element/scrollleft/index.html (limited to 'files/ru/web/api/element/scrollleft/index.html') diff --git a/files/ru/web/api/element/scrollleft/index.html b/files/ru/web/api/element/scrollleft/index.html new file mode 100644 index 0000000000..15af642a56 --- /dev/null +++ b/files/ru/web/api/element/scrollleft/index.html @@ -0,0 +1,79 @@ +--- +title: Элемент.scrollLeft +slug: Web/API/Element/scrollLeft +translation_of: Web/API/Element/scrollLeft +--- +

{{ APIRef("DOM") }}

+ +

Свойство scrollLeft получает или устанавливает количество пикселей, на которое контент элемента прокручен влево.

+ +

Заметьте, что если свойство {{cssxref("direction")}}: rtl (right-to-left), то scrollLeft равен 0, когда скроллбар на его самой правой позиции (с начала прокрученного контента), а затем становится отрицательным по мере прокрутки к концу контента.

+ +

Синтаксис

+ +
// Получаем количество прокрученных пикселей
+var sLeft = element.scrollLeft;
+
+ +

sLeft - целое число, представленное количеством пикселей, на которые элемент был прокручен влево.

+ +
// Устанавливаем количество прокрученных пикселей
+element.scrollLeft = 10;
+
+ +

scrollLeft может быть установлен, как любое целое число, однако:

+ + + +

Пример

+ +
<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <style>
+        #container {
+            border: 1px solid #ccc; height: 100px; overflow: scroll; width: 100px;
+        }
+        #content {
+            background-color: #ccc; width: 250px;
+        }
+    </style>
+    <script>
+        document.addEventListener('DOMContentLoaded', function () {
+            var button = document.getElementById('slide');
+            button.onclick = function () {
+                document.getElementById('container').scrollLeft += 20;
+            };
+        }, false);
+    </script>
+</head>
+<body>
+    <div id="container">
+        <div id="content">Бла-бла-бла</div>
+    </div>
+    <button id="slide" type="button">Пролистать</button>
+</body>
+</html>
+
+ +

Спецификации

+ + + + + + + + + + + + + + +
СпецификацииСтатусКомментарий
{{SpecName('CSSOM View', '#dom-element-scrollleft', 'scrollLeft')}}{{Spec2("CSSOM View")}} 
-- cgit v1.2.3-54-g00ecf