Скрыть дивы радиокнопкой
Всем привет, помогите сделать
имеются радиокнопки, если поставить точку на радио id="ss", то дивы box1 и box2 должны скрыться если точку с радио id="ss" убрать (нажать другую радиокнопку) - дивы box1 и box2 снова показываются у меня дивы скрываются, но снова показываться не хотят
<script type="text/javascript">
$('#ss').change(function () {
$('#box1, #box2')[this.checked ? 'hide' : 'show'](500);
});
</script>
<input id="ss" name="inp" value="" type="radio"> скрыть Div1 и Div2 <br> <input id="mm" name="inp" value="" type="radio"> <br> <input id="rr" name="inp" value="" type="radio"> <div id="box1">Div1</div> <div id="box2">Div2</div> |
<style>#ss:checked ~ #box1, #ss:checked ~ #box2 {
display: none;
}</style>
<input id="ss" name="inp" value="" type="radio"> скрыть Div1 и Div2
<br>
<input id="mm" name="inp" value="" type="radio">
<br>
<input id="rr" name="inp" value="" type="radio">
<div id="box1">Div1</div>
<div id="box2">Div2</div>
Вариант :) |
Цитата:
|
rodiony4,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function(){
$('[name="inp"]').change(function () {
$('#box1, #box2')[this.id == 'ss' ? 'hide' : 'show'](500);
});
});
</script>
</head>
<body> <input id="ss" name="inp" value="" type="radio"> скрыть Div1 и Div2
<br>
<input id="mm" name="inp" value="" type="radio">
<br>
<input id="rr" name="inp" value="" type="radio">
<div id="box1">Div1</div>
<div id="box2">Div2</div>
</body>
</html>
|
рони, спасибо, теперь дивы скрываются и снова показываются.
Хочу также сделать с другой радиокнопкой - например нажал на первый радио - два дива скрылись нажал на второй радио - скрылся один див радиокнопок будет много и много дивов которые нужно будет скрывать и показывать так не получилось
<script type="text/javascript">
$(function(){
$('[name="inp"]').change(function () {
$('#box1, #box2')[this.id == 'ss' ? 'hide' : 'show'](500);
$('#box1')[this.id == 'mm' ? 'hide' : 'show'](500);
});
});
</script>
|
rodiony4,
сначала всё скрыть -- потом показать что нужно. |
рони, можно подробнее
Цитата:
Цитата:
|
Цитата:
всем радио кнопкам один класс -- всем блокам другой и берите индекс и показывайте что вам нужно согласно индексу ... |
рони, у радиокнопок нет класса (виртуемарт joomla), у дивов класс есть
постараюсь объяснить что нужно, первый радио id="ss" - нажали на него (поставили точку) дивы #box1 и #box2 скрылись, сняли точку (например кликнули последний радио) - дивы снова показались второй радио id="mm" - нажали на него див #box1 скрылся, кликнули на последний радио - #box1 показан третий, четвертый и тд радио - ничего не скрывается вы мне уже показали пример с первой радиокнопкой, как сделать тоже самое со второй радиокнопкой? |
Цитата:
1 -> показать блок 1 2 -> показать блок1 и блок2 примерно так Цитата:
|
| Часовой пояс GMT +3, время: 23:24. |