PDA

View Full Version : سوال: کار نکردن یک خصوصیت تنظیم شده CSS



aroshanzamir
پنج شنبه 15 خرداد 1393, 00:35 صبح
سلام دوستان .. وقت شما بخیر

مشکل اینه که چک می کنه که آیا خصوصیت display یک div بلاک است یا نه
اگر بلاک باشد آن را به none تنظیم می کند

حالا که به none ست شد بار بعد که کلیک می کنیم باز هم میگه display بلاک است در شرایطی که none می باشد


این هم مثالش : مثال را نگاه کنید منظورم را متوجه می شوید

http://jsfiddle.net/h8kTQ/1/

متشکرم دوستان


این کد CSS

.mainbase {
width: 500px;
height: auto;
margin: 50px auto;
}


.mainbase .divheader {
width: 500px;
background-color: gray;
height: 30px;
}


.mainbase .divbody {
width: 500px;
height: 120px;
background-color: #eee;
display: block;
}

این JQuery

jQuery(function () {
$('.divheader').click(function () {


if ($(this).css('display') == 'block') {
alert('block');
var id = $(this).attr('id');
$('.' + id).css('display', 'none');
}
else {
alert('none');
var id = $(this).attr('id');
$('.' + id).css('display', 'none');
}
});
});



و این هم HTML


<div class="mainbase">
<div class="divheader" id="1"></div>
<div class="1 divbody"></div>
</div>

mehdi.mousavi
پنج شنبه 15 خرداد 1393, 05:49 صبح
سلام.
شما نیازی به گرفتن مقدار display ندارید. کافیه تا کد JavaScript خودتون رو بدین شکل بنویسید:

$(function () {
$('.divheader').click(function () {
$(this).next().toggle();
});
});

بدین ترتیب، با هر بار کلیک روی divheader، المنت بعدی divheader (یعنی همون div ای که می خواهید Toggle اش کنید) مخفی و سپس با کلیک بعدی ظاهر خواهد شد.

موفق باشید.