как показать div при нажатии на другой div и скрыть его при нажатии на тот же div?

получается, что с 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
0
задан molten-lead 18 January 2019 в 12:47
поделиться

3 ответа

Вы допустили ошибку в вашем селекторе CSS, это не '.category' > div, это должно быть '.category > div'

$(document).ready(function() {
  $('.category > div').on('click', function(){
    $('.wrapper').toggle();
  })
});
0
ответ дан Saraband 18 January 2019 в 12:47
поделиться

Я не уверен насчет термина , конкретного 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>

0
ответ дан Mamun 18 January 2019 в 12:47
поделиться

используйте этот код

$(document).ready(function() {
      $('.category>div' ).on('click', function(){
     $('.wrapper').toggle();
      })
    });

и добавьте этот CSS, чтобы скрыть div в начале

.wrapper{
display:none
}
0
ответ дан Ved_Code_it 18 January 2019 в 12:47
поделиться
Другие вопросы по тегам:

Похожие вопросы: