Событие по клику

@semenovvl · Регистрация: 05.09.2015

Студворк — интернет-сервис помощи студентам

Здравствуйте Уважаемые форумчане и гуру форума , я новичок в программировании поэтому прошу сильно не пинать, у меня такой вопрос, открытие скрытого блока на фреймах все работает хорошо, как переделать данный код под div-ы.

имеется такой код

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
var smmode=0;
var oshow_pd=0;
var oshow_p2d=0;
 
function sm2sh() {
   pnshow();
   top.smmode^=1;
   top.document.getElementsByName('mainframe')[0].rows=(top.smmode?"111,*,35":"75,*,35");
oshow_pd^=1;
oshow_p2d^=1;
var pdiv = parent.frames.head.pdiv || top.frames.head.document.getElementById('pdiv');
pdiv.style.display=(oshow_pd?"none":"block");
var p2div = parent.frames.head.p2div || top.frames.head.document.getElementById('p2div');
p2div.style.display=(oshow_p2d?"block":"none");
s_main();
   set_focus();
}
 
var _pnshow=0;
function pnshow() {
   var pnsm = parent.frames.head.pnsm || top.frames.head.document.getElementById('pnsm');
   if (_pnshow || !pnsm) return;
   _pnshow=1;
   var smhl = 22;
   for(var i = 1; i < smhl; i++){
   var path = 'im/sm1/' + i + '.gif'; // вот путь
   pnsm.innerHTML+=("<a href=javascript:top.sm(\"*" + i + "\")><img src=" + path + "  " + " </a>");
   pnsm.innerHTML+=('&nbsp;');
   }     
}

ссылка для вывода блока при клике

HTML5
1
<a href=# onclick="top.sm2sh(); return false;" title="панель"><b>открыть/закрыть</b></a>

сам проект для отладки

http://demo-project-semeno.c9.io/

@Unick · 05.09.2015, 13:22

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

Создаешь див с id = 'myDiv'
Даешь ссылке ссылке какой-ниб onclick="toggleClass('myDiv')"

JavaScript
1
2
3
4
function toggleClass(idDiv){
var div = window.document.getElementById(idDiv);
div.style.display = (div.style.display=='none') ? 'block' : 'none';
}

@semenovvl · 05.09.2015, 15:51 **[ТС]**

ну первое, это не копипаст вот полный код

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
// показ/скрытие панели смайликов
var smmode=0
function sm2sh() {
   pnshow()
   top.smmode^=1
   parent.mainframe.rows=top.smmode ? top.height_sm2+',*,'+top.height2 : top.height+',*,'+top.height2
   s_main()
   set_focus()
}
 
var _pnshow=0
function pnshow() {
   if (_pnshow || !parent.frames.head.pnsm) return
   _pnshow=1
   for(i=0; i<smhl.length; i++)
      parent.frames.head.pnsm.innerHTML+="<a href='javascript:top.sm(\"1/"+smhl[i]+"\")'><img src=im/sm1/"+smhl[i]+".gif border=0></a> "
}
 
_fsc=0
function fsc() {
   _fsc^=1
   parent.mainframe.rows=_fsc?'14,*,'+top.height2:top.height+',*,'+top.height2
   parent.secondframe.cols=_fsc?'*,0':'*,300'
   if (!_fsc) smmode=0
   s_main()
   set_focus()
}

верстку на дивы сделаю

Добавлено через 1 час 14 минут
вот примерная верстка под div

HTML5
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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
 
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id='topdiv' class='topbody'>
 
</div>
 
<div id='contentdiv' class='contentbody'>
 
</div>
 
<div id='usersdiv' class='usersbody'>
 
</div>
<div id='menydiv' class='menybody'>
[<a href=# onclick="top.sm2sh(); return false;" title=""><b>открыть/закрыть</b></a>]
</div>
 
<div id='bottomdiv' class='bottombody'>
 
</div>
</body>
</html>

CSS
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
.topbody {
position:absolute; 
height:75px; 
line-height:75px; 
left:0px; 
right:0px; 
top:0px; 
padding-left:10px; 
border:1px gray solid;
}
 
.contentbody {
position:absolute; 
overflow-y:scroll; 
padding-left:10px; 
left:0px; 
right:295px; 
top:75px; 
bottom:35px; 
border:1px gray solid;
}
 
.usersbody {
position:absolute;
overflow-y:auto; 
width:295px; 
top:75px; 
right:0px; 
bottom:35px; 
padding:0px; 
border:1px gray solid;
}
 
.menybody {
position:absolute; 
overflow-y:auto; 
width:295px; 
height:200px; 
right:0px; 
bottom:35px; 
padding-left:0px; 
border:1px gray solid;
}
 
.bottombody {
position:absolute; 
height:35px; 
left:0px; 
right:0px; 
bottom:0px; 
padding-left:10px; 
border:1px gray solid; 
}

@Unick · 05.09.2015, 17:39

Сообщение от semenovvl

ну первое, это не копипаст вот полный код

тогда откуда функция s_main взялась?)

@semenovvl · 05.09.2015, 18:45 **[ТС]**

JavaScript
1
2
3
function s_main() {
   parent.frames.irc.scroll(1,1000000);
}

@BANO · 07.09.2015, 16:20

semenovvl, что такое irc?

@semenovvl · 08.09.2015, 19:07 **[ТС]**

Сообщение от BANO

semenovvl, что такое irc?

давайте не будем ходить вокруг кода, что это, что то))интересует готовое решение, замене кода под div-ы и без обрезания функций, если возможно наведите на пример, а обсуждать можно годами.

сам проект для отладки на фреймах

http://demo-project-semeno.c9.io/

сам проект для отладки на div-ах

http://demo-project-semeno.c9.io/verstka_div.html

@BANO · 08.09.2015, 20:40

semenovvl, тогда можете мне персонально, такому придурку, объяснить в чём проблема?
лично у меня div#topbody исчезает и появляется по клику на "скрыть/показать"

@semenovvl · 08.09.2015, 21:58 **[ТС]**

Сообщение от BANO

semenovvl, тогда можете мне персонально, такому придурку, объяснить в чём проблема?
лично у меня div#topbody исчезает и появляется по клику на "скрыть/показать"

на фреймах, два блока сжимаются при открытии, то-есть, header сдигает их вниз, тоже самое нужно и на div-ах
и в верхнем правом углу в header, есть иконка расширить окно, вот и все что нужно.

@BANO · 08.09.2015, 22:19

semenovvl, тк вы у этих двух блоков изменяйте
тоесть примерно так же как свойство display у вашего головного блока, но теперь у этих дивов меняйте height

@semenovvl · 08.09.2015, 22:25 **[ТС]**

Сообщение от BANO

semenovvl, тк вы у этих двух блоков изменяйте
тоесть примерно так же как свойство display у вашего головного блока, но теперь у этих дивов меняйте height

пример кода можно от вас?

@BANO · 08.09.2015, 22:33

semenovvl,

JavaScript
1
2
3
4
5
6
7
function toggleClass(idDiv){
var div = window.document.getElementById(idDiv);
div.style.display = (div.style.display=='none') ? 'block' : 'none';
[].forEach.call(document.querySelectorAll(".contentbody, .menybody"),function(elem){
    elem.style.top=((div.style.display=='none')&&0 || 75)+"px";
}
}

@semenovvl · 08.09.2015, 22:50 **[ТС]**

Добавлено через 7 минут

Сообщение от BANO

semenovvl,

JavaScript
1
2
3
4
5
6
7
function toggleClass(idDiv){
var div = window.document.getElementById(idDiv);
div.style.display = (div.style.display=='none') ? 'block' : 'none';
[].forEach.call(document.querySelectorAll(".contentbody, .menybody"),function(elem){
    elem.style.top=((div.style.display=='none')&&0 || 75)+"px";
}
}

верно я что то не так делаю, не хочет работать данный код, подскажите где ошибка.

@Unick · 08.09.2015, 23:03

semenovvl, BANO,

JavaScript
1
2
3
4
5
6
7
function toggleClass(idDiv){
var div = window.document.getElementById(idDiv);
div.style.display = (div.style.display=='none') ? 'block' : 'none';
[].forEach.call(document.querySelectorAll(".contentbody, .menybody"), function(elem){
    elem.style.top=((div.style.display=='none')&&0 || 75)+"px"; 
})
}

P.s. извращение какое-то
P.s.s.

Сообщение от semenovvl

подскажите где ошибка

обычно виновата прокладка, где-то между стулом и экраном

@semenovvl · 08.09.2015, 23:24 **[ТС]**

Сообщение от Unick

semenovvl, BANO,

JavaScript
1
2
3
4
5
6
7
function toggleClass(idDiv){
var div = window.document.getElementById(idDiv);
div.style.display = (div.style.display=='none') ? 'block' : 'none';
[].forEach.call(document.querySelectorAll(".contentbody, .menybody"), function(elem){
    elem.style.top=((div.style.display=='none')&&0 || 75)+"px"; 
})
}

P.s. извращение какое-то
P.s.s.

обычно виновата прокладка, где-то между стулом и экраном

от тебя кроме негатива ничего не исходит.

@BANO · 09.09.2015, 00:07

Unick, я не собираюсь переписывать ф-цию, я просто допишу туда то, что надо
а про поиск через селектор согласен не очень, но согласись код меньше чем через getElementsByClassName

semenovvl, неужели консоль у вас молчит?

@Unick · 09.09.2015, 00:08

Сообщение от semenovvl

от тебя кроме негатива ничего не исходит.

какой негатив?

Ты не знаешь что такое негатив

в сообщении выше я поправил функцию, и не более.

Сообщение от semenovvl

давайте не будем ходить вокруг кода, что это, что то))

так у тебя сайт в консоли ошибки сыпет, ты бы такие вещи лучше сам проверял

Сообщение от semenovvl

интересует готовое решение

это тогда тебе на фриланс! коль тут, то делай сам... а как? это мы уже тебе подскажем

Сообщение от semenovvl

а обсуждать можно годами

не на столько тривиальные вещи. грамотный вопрос - половина ответа

хочешь чтобы верхнее меню "увеличивалось"? не делай position: absolute всем элементам, переверстай на relative и сделай для верхнего меню обертку из дива

Добавлено через 31 секунду

Сообщение от BANO

Unick, я не собираюсь переписывать ф-цию, я просто допишу туда то, что надо

ты там скобки забыл закрыть

@BANO · 09.09.2015, 00:11

Сообщение от Unick

ты там скобки забыл закрыть

реально?
блин вот я дебил

Добавлено через 47 секунд
")" забыл поставить действительно

@semenovvl · 09.09.2015, 18:05 **[ТС]**

по существу вот оно решение, но на jquery, и бредово двумя кнопками, как на одну кнопку все повесить?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("#btn1").click(function(){
        $("#topdiv").animate({height: "111px"});
    });
    $("#btn2").click(function(){
        $("#topdiv").animate({height: "75px"});
    });
});
</script>
 
<div id='usersdiv' class='usersbody'><br><br><br>
<a href=# id="btn1">[открыть]</a>
 
<a href=# id="btn2">[закрыть]</a>
   </div>

@BANO · 09.09.2015, 18:21

semenovvl,

JavaScript
1
2
3
4
flag=!0;
btn1.onclick=function(){
    topdiv.style.height=(flag^=1&&(75)||111)+"px"
}

Новые блоги и статьи Все статьи Все блоги /
Новый CodeBlocs. Версия 25.03 palva 04.01.2026 Оказывается, недавно вышла новая версия CodeBlocks за номером 25. 03. Когда-то давно я возился с только что вышедшей тогда версией 20. 03. С тех пор я давно снёс всё с компьютера и забыл. Теперь. . .	Модель микоризы: классовый агентный подход anaschu 02.01.2026 Раньше это было два гриба и бактерия. Теперь три гриба, растение. И на уровне агентов добавится между грибами или бактериями взаимодействий. До того я пробовал подход через многомерные массивы,. . .	Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	07.09.2015, 16:20
	semenovvl, что такое irc? 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	08.09.2015, 20:40
	semenovvl, тогда можете мне персонально, такому придурку, объяснить в чём проблема? лично у меня div#topbody исчезает и появляется по клику на "скрыть/показать" 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	08.09.2015, 22:19
	semenovvl, тк вы у этих двух блоков изменяйте тоесть примерно так же как свойство display у вашего головного блока, но теперь у этих дивов меняйте height 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	09.09.2015, 00:07
	Unick, я не собираюсь переписывать ф-цию, я просто допишу туда то, что надо а про поиск через селектор согласен не очень, но согласись код меньше чем через getElementsByClassName semenovvl, неужели консоль у вас молчит? 0

Событие по клику

Решение