Форум программистов, компьютерный форум, киберфорум
Наши страницы
JavaScript
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.64/11: Рейтинг темы: голосов - 11, средняя оценка - 4.64
Redfoo228
0 / 0 / 3
Регистрация: 20.05.2015
Сообщений: 17
1

Перелистывание блоков

23.04.2016, 00:39. Просмотров 2101. Ответов 2
Метки нет (Все метки)

Всем доброго времени суток!
Помогите пожалуйста с реализацией идеи.
Например есть 10 блоков. Нужно чтобы можно было их перелистывать зажав ЛКМ.
Пример: http://nikoland.ru/
Заранее спасибо!
0
Лучшие ответы (1)
QA
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
23.04.2016, 00:39
Ответы с готовыми решениями:

Перелистывание влево
что нужно поменять в функции, чтобы картинка двигалась влево? function moveright() { if...

Читалка.перелистывание страниц
Надо организовать на сайте читалку, пока решил сделать чего попроще и сразу пришел в тупик....

Календарь Перелистывание по месяцам
Есть следующий календарь <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"...

Перелистывание картинок javascript
Мне нужно создать круговое перелистывание картинок.Тоесть у меня есть 7 картинок , ниже их 2 кнопки...

Как создается перелистывание слайдов мышью?
Как создается такой эффект в слайдере, когда перелистывание осуществляется с помощью захвата...

2
Kindness
0 / 0 / 2
Регистрация: 22.04.2016
Сообщений: 11
23.04.2016, 21:31 2
Лучший ответ Сообщение было отмечено Redfoo228 как решение

Решение

Что-нибудь на подобии такого?
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<html>
    <head>
        <style>
            html {
                overflow-x: hidden;
            }
            .div {
                position: absolute;
                width: 500px;
                height: 400px;
                background-color: cyan;
            }
        </style>
    </head>
    <body>
        <div id="divs" style="position: absolute; left: 100px; top: 150px;" onmousedown="divsMoveStart(event)" onmousemove="divsMove(event)">
            <div class="div" style="left: 0px"></div>
            <div class="div" style="left: 520px"></div>
            <div class="div" style="left: 1040px"></div>
            <div class="div" style="left: 1560px"></div>
            <div class="div" style="left: 2080px"></div>
        </div>
        <script>
            var startLeft;
            var startX;
            var k, rightMax = -1300;
 
            function divsMoveStart(event) {
                if (event.buttons == 1 && event.button == 0) {
                    event.preventDefault();
                    startLeft = parseInt(document.all.divs.style.left);
                    startX = event.clientX;
                }
            }
 
            function divsMove(event) {
                if (event.buttons == 1 && event.button == 0) {
                    k = startLeft - startX + event.clientX;
                    if (k >= 100) {
                        document.all.divs.style.left = 100 + "px";
                        return;
                    } else
                    if (k <= rightMax) {
                        document.all.divs.style.left = rightMax + "px";
                        return;
                    }
                    document.all.divs.style.left = k + "px";
                }
            }
        </script>
    </body>
</html>
0
Redfoo228
0 / 0 / 3
Регистрация: 20.05.2015
Сообщений: 17
24.04.2016, 09:21  [ТС] 3
Kindness, Спасибо!))
0
Answers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
24.04.2016, 09:21

Перелистывание страниц с помощью стрелочек клавиатуры
Здравствуйте! Такой вопрос. Допустим у меня есть 2 страницы page1.php и page2.php Как...

Клонирование блоков
Всем привет, есть ли такое в js или jq - клонирование блоков Например я на сайте расположил блок в...

Слайдер блоков
Есть блок с несколькими article, внизу есть кнопки выбора месяца в году, нужно чтобы при нажатии на...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2020, vBulletin Solutions, Inc.