получается, что с python 2.5.2 del l[:]
немного медленнее, чем l[:] = []
на 1.1 мкс.
$ python -mtimeit "l=list(range(1000))" "b=l[:];del b[:]"
10000 loops, best of 3: 29.8 usec per loop
$ python -mtimeit "l=list(range(1000))" "b=l[:];b[:] = []"
10000 loops, best of 3: 28.7 usec per loop
$ python -V
Python 2.5.2
Вы допустили ошибку в вашем селекторе CSS, это не '.category' > div
, это должно быть '.category > div'
$(document).ready(function() {
$('.category > div').on('click', function(){
$('.wrapper').toggle();
})
});
Я не уверен насчет термина , конкретного div здесь. Может быть, вы можете попробовать с toggle()
. У вас также есть синтаксическая ошибка при переносе селектора:
$(document).ready(function() {
$('.category > div').on('click', function(){
$('.wrapper').toggle();
})
});
/*styles individual divs in the category class*/
.category > div:hover {
cursor: pointer;
transform-style: flat;
animation-delay: 0.1s;
display: flex;
border: 1px 1px 1px 1px solid;
background-color: #898488;
color: #7AC4EE;
border-left-color: yellow;
box-sizing: border-box;
}
/*class that i want to display on click*/
.wrapper {
display: none;
flex-wrap: wrap;
justify-content: space-between;
background-color: white;
box-sizing: border-box;
width: 623px;
padding: 0;
align-self: center;
height: 100%;
margin-bottom: auto;
box-shadow: 0px 3px 7px 0px rgba(0,0,0,0.3);
}
/*the classes below are in .wrapper*/
.control {
flex: 1;
background:white;
position: relative;
}
.content {
flex: 4;
height: 92%;
width: 415px;
margin-top: 5px;
margin-bottom: 5px;
background: lightblue;
position: relative;
}
.content_desc {
flex: 2;
height: 22px;
width: 415px;
margin-top: 370px ;
margin-left: 104px;
margin-right: 98.5px;
background-color: white;
border: 0.3px solid;
position: absolute;
}
.control img {
position: absolute;
left: 50%;
top: 50%;
height: 40px;
width: 40px;
background: white;
box-sizing: border-box;
transform: translate(-50%, -50%);
}
.control img:hover {
cursor: pointer;
background-color: yellow;
transition-delay: 0.2s;
animation: 0.1s ease-in;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="category">
<div class="furniture">Furniture</div>
<div class="tableware">Tableware</div>
<div class="jewellery">Jewellery</div>
<div class="shoes">Shoes</div>
<div class="water_bottles">Water Bottles</div>
<div class="clothes">Clothes</div>
<div class="textiles">Fabric Patterns</div>
</div>
<div class="upload">
<div class="wrapper">
<div class="control"><img src="back.png"></div>
<div class="content"></div>
<div class="content_desc"></div>
<div class="control"><img src="forward.png"></div>
</div>
</div>
используйте этот код
$(document).ready(function() {
$('.category>div' ).on('click', function(){
$('.wrapper').toggle();
})
});
и добавьте этот CSS, чтобы скрыть div в начале
.wrapper{
display:none
}