ruarhyzh-CNcsdanlenfrkadeeliwitjakoestr

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

При клике по ссылке открывается DIV блок, еще раз при клике по той же ссылке это окно закрывается

 

<script type="text/javascript">

function openbox(id){
    display = document.getElementById(id).style.display;

    if(display=='none'){
       document.getElementById(id).style.display='block';
    }else{
       document.getElementById(id).style.display='none';
    }
}
</script>

 

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

 

<a href="#" onclick="openbox('box'); return false">Открыть</a>

 

 

 Наш блок

<div id="box" style="display: none;">Наш блок</div>

 

Чтобы изменилось слово закрыть открыть в зависимости от состояния, используйте следующий код:

 

window.onload= function() {
	document.getElementById('toggler').onclick = function() {
		openbox('box', this);
		return false;
	};
};
function openbox(id, toggler) {
	var div = document.getElementById(id);
	if(div.style.display == 'block') {
		div.style.display = 'none';
		toggler.innerHTML = 'Открыть';
	}
	else {
		div.style.display = 'block';
		toggler.innerHTML = 'Закрыть';
	}
}

 

Ссылка будет иметь вид:

 

<a id="toggler" href="#">Открыть</a>

 

Блок будет иметь вид:

 

<div id="box" style="display: none;">Наш блок</div>

 


e-mail

All rights reserved. © 2006-2024. При перепечатке текстов, активная, видимая ссылка на TopWebDesign.ru обязательна.

Сайт носит исключительно информационный характер и никакая информация, опубликованная на нём, ни при каких условиях не является публичной офертой, определяемой положениями статьи 437 Гражданского кодекса РФ. Настоящий ресурс может содержать материалы 18+

Продолжая использовать наш сайт, Вы даете согласие на обработку файлов cookies и пользовательских данных, подробнее в нашей Политике Cookie. Если Вы не хотите, чтобы Ваши данные обрабатывались, пожалуйста, покиньте сайт.

Наверх Вниз