Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Смена div'ов. (https://javascript.ru/forum/misc/37392-smena-div%27ov.html)

JS_Den 17.04.2013 23:49

Смена div'ов.
 
Имеется 3 заголовка-кнопки. При нажатии на один из них выпадает прикреплённый к нему же div. При нажатии на второй - второй div. При нажатии на третий - третий. Располагаются они естественно друг под другом (активированы все или несколько).
Подскажите как сделать, чтобы при активированном например первом div'е и при нажатии на второй заголовок - первый div скрывался, а оставался только второй.

Css код:

#primeri1{
text-align:center;
display:none;
border: 1px solid green;
}
#primeri2{
text-align:center;
display:none;
border: 1px solid red;
}
#primeri3{
text-align:center;
display:none;
border: 1px solid black;
}

JS код:

var flag;
function primeri1()
{
if (flag == 1)
{
$("#primeri1").fadeTo(500,1);
flag = 2;
}
else
{
$("#primeri1").fadeTo(500,0);
flag = 1;
$("#primeri1").hide();
}
}

function primeri2()
{
if (flag == 1)
{
$("#primeri2").fadeTo(500,1);
flag = 2;
}
else
{
$("#primeri2").fadeTo(500,0);
flag = 1;
$("#primeri2").hide();
}
}

function primeri3()
{
if (flag == 1)
{
$("#primeri3").fadeTo(500,1);
flag = 2;
}
else
{
$("#primeri3").fadeTo(500,0);
flag = 1;
$("#primeri3").hide();
}
}

Обработчик onclick расположен в коде html заголовка.

skrudjmakdak 18.04.2013 09:24

а сам html собсенно где? и оборачивайте в тэги, так лучше читать код

Vasy 18.04.2013 13:00

Там где вы вызываете <div> по нажатию,ставте сразу .hide() предыдущий либо же
у меня так,тоесть скрывает <div> с id="send"
var button = document.getElementById("send");
button.style.display='none';


либо же можете поставить какоето условие,нажали ли вы на <div> или нет.Саме простое что приходит,это сделать счестчик нажатий на кнопку.Если нажали 1 раз то при нажатии на какойто другой скрывать те на которые нажали 1 раз.А по второму нажатию раскрывать <div> и скрывать все на которые нажато 1 раз.и котоыре небыли скрыты,ну и так далее.а отобразить скрытый <div> вот так
button.style.display='';

skrudjmakdak 18.04.2013 13:08

если я вас правильно понял, конечно...

var button1 = $('#button1'),
     button2 = $('#button2'),
     button3 = $('#button3'),
     window1 = $('#window1'),
     window2 = $('#window2'),
     window3 = $('#window3');

$(window1).onclick(function()
    {
    $(window1).fadeTo(500,1);
    $(window2).hide();
    $(window3).hide();
    });

$(window2).onclick(function()
    {
    $(window1).hide();
    $(window2).fadeTo(500,1);
    $(window3).hide();
    });

$(window3).onclick(function()
    {
    $(window1).hide();
    $(window2).hide();
    $(window3).fadeTo(500,1);
    });

JS_Den 18.04.2013 22:24

Спасибо большое, skrudjmakdak)). Оказалось все неимоверно просто. Сам же усложнил себе жизнь поиском алгоритма).


Часовой пояс GMT +3, время: 20:03.