Есть такая функция, которая находит элемент на страницу, но когда я пытаюсь сделать что-либо с этим элементом, то консоль выдает:
$list.css is not a function
Как мне проводить манипуляции с этой переменной?
$(document).on('click', ".repair_item", function() {
var $list = $(this).find(".repair_item_hiddenList_js").html();
$list.css('display', 'block');
});
.repair_item {
width: 300px;
height: 140px;
margin-bottom: 30px;
}
.repair_item:hover {
cursor: pointer;
}
.repair_item_flex {
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.repair_item_img {
width: 50%;
height: 100%;
}
.repair_item_img img {
width: 100%;
height: 100%;
}
.repair_item_text {
width: 50%;
height: 100%;
background-color: #37acfb;
color: white;
font-size: 15px;
font-family: "Roboto Consendered Bold";
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-transform: uppercase;
}
.repair_item_hiddenList {
display: none;
background-color: #252525;
width: 100%;
color: white;
padding: 25px 30px 20px;
left: 0px;
margin-top: 40px;
}
.repair_item_hiddenList_title {
font-size: 17px;
font-family: "Roboto Consendered Bold";
}
.repair_item_hiddenList_list {
list-style: none;
padding-left: 0px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.repair_item_hiddenList_list li {
font-size: 15px;
font-family: "Roboto Consendered Regular";
display: block;
width: 270px;
margin-bottom: 15px;
}
.repair_item_hiddenList_list li:before {
content: "-";
position: relative;
left: -10px;
}
Что мы можем сделать
- Замена стекла
- Ремонт дисплея после попадания влаги
- Наклейка защитной пленки
- Замена дисплейного модуля
- Калибровка экрана
- Выведение легких царапин и потертостей
- Чистка дисплея от пыли
- Наклейка защитного стекла
- Диагностика
$(document).on('click', ".repair_item", function() { var $list = $(this).find(".repair_item_hiddenList_js").html(); $list.css('display', 'block'); });
Ответ
Вам нужно не block.html() добавлять .css, а самому блоку.
Но, как я понимаю,
не самому .repair_item_hiddenList_js, а его "ребенка" - .repair_item_hiddenList Вы хотите показывать, поэтому так:
$(document).on('click', ".repair_item", function() {
var $list = $(this).find(".repair_item_hiddenList");
$list.css({'display': 'block'});
});
.repair_item {
width: 300px;
height: 140px;
margin-bottom: 30px;
}
.repair_item:hover {
cursor: pointer;
}
.repair_item_flex {
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.repair_item_img {
width: 50%;
height: 100%;
}
.repair_item_img img {
width: 100%;
height: 100%;
}
.repair_item_text {
width: 50%;
height: 100%;
background-color: #37acfb;
color: white;
font-size: 15px;
font-family: "Roboto Consendered Bold";
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-transform: uppercase;
}
.repair_item_hiddenList {
display: none;
background-color: #252525;
width: 100%;
color: white;
padding: 25px 30px 20px;
left: 0px;
margin-top: 40px;
}
.repair_item_hiddenList_title {
font-size: 17px;
font-family: "Roboto Consendered Bold";
}
.repair_item_hiddenList_list {
list-style: none;
padding-left: 0px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.repair_item_hiddenList_list li {
font-size: 15px;
font-family: "Roboto Consendered Regular";
display: block;
width: 270px;
margin-bottom: 15px;
}
.repair_item_hiddenList_list li:before {
content: "-";
position: relative;
left: -10px;
}
Что мы можем сделать
- Замена стекла
- Ремонт дисплея после попадания влаги
- Наклейка защитной пленки
- Замена дисплейного модуля
- Калибровка экрана
- Выведение легких царапин и потертостей
- Чистка дисплея от пыли
- Наклейка защитного стекла
- Диагностика
Комментариев нет:
Отправить комментарий