Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Другие темы раздела
JavaScript В html из файла https://www.cyberforum.ru/ javascript/ thread5098.html
Народ возник вопрос. мне нада чтоб html страница с помощью скрипта (лутше ява) в одно место подгружала из файла текст и он распознавался страницей как html код
Диалоговое окно с кнопками "да" и "нет" JavaScript
Подскажите как сделать, когда жмешь на картинку, что бы выходило диалоговое окно с кнопкоми да и нет, подтверждение действия.
JavaScript Исходник сапера на javascript
Помогите пожалуйста найти исходник игры сапер на javascript. Очень нужно. Заранее благодарю
JavaScript Нужен учебник по Js Дайте пожалуста Полный путёвый учебник по JavaScript со словарём со всеми функциями примерами и наворотами под несколько браузеров !!!!! Doberman@xaker.ru или ссылку!! Заранее огромное спасибо! https://www.cyberforum.ru/ javascript/ thread4236.html
JavaScript swfobject.js как его писать или дайте учебник(на русском) https://www.cyberforum.ru/ javascript/ thread4222.html
Помогите разобраться в сценарии с расшерение js, в частности хочу сделать менюшку что бы она отображалась когдта в браузере отключен запуск активного содержания окна и отоброжение рисунков Заранее...
JavaScript вопрос javascript
как задать исполнение скрипта в определенной ячейке таблицы текущего документа(сменяемый текст)...
Изменение размера окна -> изменение размера картинки JavaScript
Есть картинка на Homepage, как сделать так, что бы при изменении окна браузера размер картинки автоматически изменялся соответственно размерам окна.
JavaScript Ссылка на дочернее окно (javascript) Привет всем. Неподскажете как получить ссылку на дочернее окно из родительского (при отсуствие ссылки 'widow.open()') ? Проблема в следующем. Есть N-ное количество всплывающих окон открытых одно... https://www.cyberforum.ru/ javascript/ thread4105.html
JavaScript Технология AJAX или опять JS? https://www.cyberforum.ru/ javascript/ thread3489.html
Необходимо добавить на страницу таблицу с данными из текстового файла вида: 0|data1|data2|data3... 1|data1|... ... n|data1|... Мне нужно загнать все эти данные в двумерный массив. В PHP это...
JavaScript Ловля Enter'a c помощью удочки Javascript Два элемента формы (text,password). Юзер активировал text и ввёл, допустим, логин. Далее нужно при нажатии на Enter активировать пароль. https://www.cyberforum.ru/ javascript/ thread3331.html
346 / 321 / 203
Регистрация: 27.06.2014
Сообщений: 762
12.11.2015, 11:52 0

Обмен готовыми решениями

12.11.2015, 11:52. Просмотров 64934. Ответов 66
Метки (Все метки)

Ответ


Если кому интересно вот мой список из 4-х методов
css - позволяет передать группу стилей в элемент через объект
spoiler - сворачивает/разворачивает указанный элемент
moving - позволяет перемещать элемент по странице
resize - позволяет изменять размеры высоты и ширины элемента
PHP/HTML
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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
<!DOCTYPE html>
<html>
<head>
    <title>lib</title>
    <script>
        var lib = (function () {
            "use-strict";
            js = {};
            js.css = function (elem, css) {
                for (var i in css) elem.style[i] = css[i];
            }
            js.spoiler = function (activator, block, open) {
                /*
                 * activator - элемент при клике на который будет происходить сворачивание/разворачивание блока (string = selector || html element)
                 * block     - блок который будет сворачиваться и разворачиваться (string = selector || html element)
                 * open      - (не обязательно) начальное состояние блока открыт/закрыт (default - false || true)
                 * */
                var a = typeof activator === "string" ? document.querySelector (activator) : activator,
                        b = typeof block === "string"     ? document.querySelector (block)     : block,
                        h = b.offsetHeight,
                        p = getComputedStyle (b)["padding"],
                        m = getComputedStyle (b)["margin"],
                        r = getComputedStyle (b)["border"],
                        f = function () {
                            if (b.offsetHeight !== 0) {
                                if (h !== b.offsetHeight) h = b.offsetHeight;
                            }
                            js.css (b, b.offsetHeight == 0 ?
                                {height:h + "px", padding: p, margin: m, border: r, overflow: "visible"} :
                                {height:0, padding: 0, margin: 0, border : 0, overflow: "hidden"}
                            );
                        };
                if (open !== true) js.css (b, {height:0, padding: 0, margin: 0, border : 0});
                a.addEventListener ("click", f);
            }
            js.moving = function (active, relocatable, config) {
                /*
                 active      - элемент который будет захватываться мышкой (string = selector || html element)
                 relocatable - перемещаемый элемент (string = selector || html element)
                 config       - object
                    output      - метка определяющая перемещение элементов HTML при выходе за пределы захваченного элемента (default = false || true)
                 */
                var objActive = typeof active === "string" ? document.querySelector(active) : active,
                    objMoving = typeof relocatable === "string" ? document.querySelector(relocatable) : relocatable,
                    objStatus = false,
                    startPos  = {x:"", y:""},
                    move = function (e) {
                            if(objStatus){
                                objMoving.style.top  = e.clientY - startPos.y + "px";
                                objMoving.style.left = e.clientX - startPos.x + "px";
                            }
                    },
                    down = function (e) {
                            objStatus = true;
                            startPos.x = e.clientX - objMoving.offsetLeft;
                            startPos.y = e.clientY - objMoving.offsetTop;
                    },
                    up = function () {
                            objStatus = false;
                    };
                config    = typeof config !== "object" ? {} : config;
                config.output = typeof config.output === "undefined" ? true : config.output;
                objActive.addEventListener("mousedown", down);
                if(config.output) document.addEventListener("mousemove", move);
                else objActive.addEventListener("mousemove", move);
                document.addEventListener("mouseup", up);
            }
            js.resize = function (eResize, cssSeizure) {
                /*
                 * eResize - элемент который будет менять размеры (string = selector || html element)
                 * cssSeizure - настройки стилей для элемента регулятора размеров (object)
                 * */
                var seizure   = document.createElement ("div"),
                    cssR      = {
                        position: "absolute",
                        right: "-15px",
                        bottom: "-15px",
                        width: "15px",
                        height: "15px",
                        background: "rgba(0,0,0,0.7)",
                        zIndex: 9999999
                    },
                    resize    = typeof eResize === "string" ? document.querySelector (eResize) : eResize,
                    objStatus = false,
                    startPos  = {x:"", y:""},
                    wrapp = resize.parentNode.classList.contains ("relocBlock") ? resize.parentNode : resize,
                    move = function (e) {
                            if(objStatus){
                                var sTop = parseInt (getComputedStyle (seizure)["top"]),
                                    sLeft = parseInt (getComputedStyle (seizure)["left"]),
                                    nTop, nLeft;
                                seizure.style.top  = e.clientY - startPos.y + "px";
                                seizure.style.left = e.clientX - startPos.x + "px";
                                nTop = parseInt (getComputedStyle (seizure)["top"]);
                                nLeft = parseInt (getComputedStyle (seizure)["left"]);
                                resize.style.width = (parseInt (getComputedStyle (resize)["width"]) - (sLeft - nLeft)) + "px";
                                resize.style.height = (parseInt (getComputedStyle (resize)["height"]) - (sTop - nTop)) + "px";
                                if (0 >= seizure.offsetLeft) {
                                    resize.style.width = 0 + "px";
                                    seizure.style.left = 0 + "px";
                                }
                                if (0 >= seizure.offsetTop) {
                                    seizure.style.top = 0 + "px";
                                    resize.style.height = 0 + "px";
                                };
                            }
                        },
                    down = function (e) {
                            objStatus = true;
                            startPos.x = e.clientX - seizure.offsetLeft;
                            startPos.y = e.clientY - seizure.offsetTop;
                        },
                    up = function () {
                            objStatus = false;
                    },
                    pos = getComputedStyle(resize)["position"];
                if (typeof parseInt (getComputedStyle (wrapp)["bottom"]) === "number") {
                    wrapp.style.top = wrapp.offsetTop + "px";
                    wrapp.style.bottom = "auto";
                }
                if (typeof parseInt (getComputedStyle (wrapp)["right"]) === "number") {
                    wrapp.style.left = wrapp.offsetLeft + "px";
                    wrapp.style.right = "auto";
                }
                if (typeof cssSeizure === "object") {
                    var ban = ["position", "left", "right", "top", "bottom", "width", "height"]
                    for (var i in cssSeizure) {
                        if (ban.indexOf (i) !== -1) continue;
                        cssR[i] = cssSeizure[i];
                    }
                }
                js.css (seizure, cssR);
                if (pos !== "fixed" && pos !== "absolute" &&pos !== "relative") resize.style.position = "relative";
                seizure.classList.add ("resize");
                resize.appendChild (seizure);
                seizure.addEventListener("mousedown", down);
                document.addEventListener("mousemove", move);
                document.addEventListener("mouseup", up);
            }
            return js;
        } ());
        window.addEventListener ("load", function () {
            lib.resize (".elem .wrapp");
            lib.moving (".elem .reloc", ".elem");
            lib.spoiler (".elem .spoiler", ".elem .wrapp", true);
        });
    </script>
    <style>
        .elem{position:fixed;left:100px;top:100px;}
        .elem .wrapp{
            width: 300px;
            height: 100px;
            background: rgba(0,0,0,0.3);
            border: solid 1px rgba(255,0,0,1);
            box-shadow: inset 0px 0px 25px rgba(255,0,0,1), 0px 0px 25px rgba(255,0,0,1);
        }
        .elem .reloc{
            position: absolute;
            right: 0px;
            width: 50px;
            height: 25px;
            background: rgba(255,0,0,0.3);
            border: solid 1px rgba(255,0,0,1);
            box-shadow: inset 0px 0px 15px rgba(255,0,0,1), 0px 0px 15px rgba(255,0,0,1);
            top: -30px;
        }
        .elem .spoiler{
            position: absolute;
            right: 0px;
            width: 25px;
            height: 25px;
            background: rgba(0,150,255,0.3);
            border: solid 1px rgba(0,150,255,1);
            box-shadow: inset 0px 0px 15px rgba(0,150,255,1), 0px 0px 15px rgba(0,150,255,1);
            top: -60px;
        }
    </style>
</head>
<body>
    <div class="elem">
        <div class="reloc"></div>
        <div class="spoiler"></div>
        <div class="wrapp"></div>
    </div>
</body>
</html>


Вернуться к обсуждению:
Обмен готовыми решениями
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
12.11.2015, 11:52
Готовые ответы и решения:

Обмен готовыми решениями
Привет, мир! Предлагаю здесь обмениваться готовыми решениями, исключительно html + css. Итак,...

Обмен готовыми решениями
&lt;?PHP echo getfilesize($_GET); // Функция для определения размера function...

Обсуждение класса постраничной навигации из темы "Обмен готовыми решениями"
Выделено из темы: https://www.cyberforum.ru/php/thread158262-page2.html Para bellum, может стоит...

Scanf с готовыми строками
Народ. Вопрос состоит в следующем: как применить scanf к уже введённой строке? Заранее спасибо за...

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