Как вернуть блок обратно?
Вложений: 2
Вечер народ. Есть блок, который можно выбрать. Выбор осуществляется нажатием на упаковку или на текст "купи" в описании. Можно отменить выбор повторным нажатием на блок и здесь у меня вопрос, как вернуть голубой блок с розового?
Переход:
var chan = $('.changes_1');
chan.click(function(){
$('#block_1').css({'border':'solid 6px #E72E7A'});
$('.circle_1').css({'background-color':'#E72E7A'});
$('#ad').text('Печень утки разварная с артишоками.');
});
Скрин 1-ый. Оригинал. Скрин 2-ой. После нажатия на оригинал. И повторюсь вернуться с нажатого блока на оригинал. |
Артур_ в_отчаянии, надо отдельные стили сделать для нажатого состояния. Потом просто переключать их.
<style>
.block {
width: 200px;
height: 100px;
border: 2px solid #ccc;
}
.active {
background: #ccc;
}
</style>
<div class="block">
</div>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$('.block').on('click', function(event) {
$(this).toggleClass('active');
});
</script>
|
Decode, подскажите, как ещё текст вернуть обратно?
|
Например, так:
<style>
.block {
width: 200px;
height: 100px;
border: 2px solid #ccc;
}
.active {
background: #ccc;
}
</style>
<div class="block">
<p>Bla-bla</p>
</div>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
var txt = $('.block').children('p').text();
$('.block').on('click', function(event) {
$(this).toggleClass('active');
$(this).children('p').text( $(this).children('p').text() == txt ? 'Tra-ta-ta' : txt);
});
</script>
|
Decode, выручаете прямо. Спасибо большое, но возвращаемый это ссылка, и после переключения он должен оставаться ссылкой, а так просто текст.
|
<style>
.block {
width: 200px;
height: 100px;
border: 2px solid #ccc;
}
.active {
background: #ccc;
}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(function () {
var txt = $('.block').children('p').html();
$('.block').on('click', function (event) {
$(this).toggleClass('active');
($('.block').children('p').html() == txt) ? $('.block').children('p').text('Тратата') : $('.block').children('p').html(txt);
});
})
</script>
<div class="block">
<p><a href="#">Bla-bla</a></p>
</div>
|
destus, не перевелись ещё хорошие аспиранты на Руси. Спасибо!
|
| Часовой пояс GMT +3, время: 08:46. |