Помогите сделать селект.
HTML:
<?php if ( have_posts() ) : query_posts('cat=5'); while (have_posts()) : the_post(); ?>
<?php $thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), full ); ?>
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="wr_part part" style="background: url(<?php echo $thumbnail[0];?>)">
<p class="ttl"><? the_title()?></p>
<div class="partwr"><? the_content()?></div>
</div>
</div>
<? endwhile; endif; wp_reset_query(); ?>
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="ttlp"><? the_content()?></div>
</div>
</div>
$(".part").click(function() {
var color = $(this).children('.ttl');
color.css('color', '#4c8d9f');
var value = $(this).children('.partwr').html();
var posledniy = $(".ttlp p").last(); //последний элемент
if($(".ttlp p").last()){
var spisok = $(".ttlp").append(value);
posledniy.addClass('deactivated');
}
});
я сделал триггер, чтобы блок появлялся и исчезал, но не знаю ,как сделатб, чтобы менялся цвет? сейчас, один раз нажал, он поменялся, но мне нужно, когда нажимаю на другую кнопку, цвет менялся на обратный |
Цитата:
|
там если последний элемент в списке, то не скрываем его, а те, готовые перед ним, скрываем)) я намудрил, может можно както по другому сделать..
|
artem55555p,
а html можно и описание? |
не понял
|
https://ru.stackoverflow.com/questio...D%D0%B0-jquery тут подробнее вроде расписал
|
Цитата:
вам нужна открывашка искать по форуму, есть более 300 вариантов. |
можете подсказать, как цвет менять? по клику если на другую кнопку, на предыдущей текст меняется
|
artem55555p,
я не понимаю вас, мне нужен html и описание того, что вы хотите сделать. |
открывашка со сменой фона
artem55555p,
:(
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.act .ttl{
color: #FF0000;
}
.partwr, .deactivated{
display: none;
}
.part, .ttlp{
width: 200px;
height: 80px;
background-size: cover;
float: left;
margin-left: 10px;
}
.ttlp{
float: none;
margin-top: 100px;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
var part = $(".part"), out = $(".ttlp");
part.on("click", function() {
var el = $(this).toggleClass("act");
part.not(el).removeClass("act");
var bg = el.attr("style");
if (el.is(".act")) {
out.html($(".partwr", el).html()).removeClass("deactivated").attr("style", bg);
} else {
out.addClass("deactivated");
}
}).eq(0).click();
});
</script>
</head>
<body>
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="wr_part part" style="background: url(https://ds04.infourok.ru/uploads/ex/1274/00028373-8ce7411f/hello_html_4c0f7715.jpg)">
<p class="ttl">the_title1</p>
<div class="partwr">the_content1</div>
</div>
</div>
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="wr_part part" style="background: url(https://desktopmania.ru/pics/00/71/21/DesktopMania.ru-71215-300x168.jpg)">
<p class="ttl">the_title2</p>
<div class="partwr">the_content2</div>
</div>
</div>
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="wr_part part" style="background: url(http://astromera.ru/wp-content/uploads/2016/02/chistaya-voda-1-450x225.jpg)">
<p class="ttl">the_title3</p>
<div class="partwr">the_content3</div>
</div>
</div><br>
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="ttlp"></div>
</div>
</body>
</html>
|
| Часовой пояс GMT +3, время: 23:25. |