Подменю раскрывающегося меню появляются при наведении курсора на другое раскрывающееся меню.

String#replace не поддерживает регулярное выражение, используйте String#replaceAll:

x = x.replaceAll(".+", "x");
1
задан TapTapGo 16 January 2019 в 20:09
поделиться

2 ответа

Похоже, вы использовали таргетинг 'elec' вместо 'home1':

.cat_home_appliance:hover > home1 {
    display: block;
}
0
ответ дан crffty 16 January 2019 в 20:09
поделиться

Это должно привести вас к правильному пути. Я убрал CSS (чтобы вы могли видеть, что происходит), изменил elect на кнопку и добавил обертку вокруг вашего elec1 - elec3

Надеюсь, это поможет [ 119]

.cat_electronics, .cat_home_appliances {
  display: inline-block;
  padding: 1rem;
}

.elect-container, .home1 {
  display: none;
  position: absolute;
}

.cat_electronics:hover > .elect-container {
  display: block;
}

.cat_home_appliances:hover > .home1 {
  display: block;
}
<div class="header_wrapper">
  <a href="index.php"><img src="images/1.jpg"></a>
</div>

<div class="search">
  <form method="get" action="search.php">
    <input type="text" name="search" placeholder="Search...">
    <button type="submit">Submit</button>
  </form>
</div>

<div class="account">
  <a href="signup.php">SignUp</a>
  <a href="signin.php">SignIn</a>
  <a href="my_account.php">My Account</a>
  <a href="cart.php">Cart</a>
  <a href="track_order.php">Track Order</a>
</div>

<div class="cat_electronics">
  <button>Elecronics</button>
    <div class="elect-container">
      <div class="elec">
        <a>Mobiles<i class="fas fa-caret-down"></i></a>
        <a>Mi</a>
        <a>Realme</a>
        <a>Samsung</a>
        <a>Sony</a>
        <a>Infinix</a>
        <a>Oppo</a>
        <a>Vivo</a>
        <a>Nokia</a>
        <a>Motorola</a>
        <a>Apple</a>
        <a>Lenovo</a>
        <a>honor</a>
        <a>Asus</a>
        <a>Google Pixel</a>
      </div>

      <div class="elec1">
        <a>Mobile Accessories<i class="fas fa-caret-down"></i></a>
        <a>Mobile Cases</a>
        <a>Headphones & Headsets</a>
        <a>Power Banks</a>
        <a>Screenguards</a>
        <a>Memory Cards</a>
        <a>Memory Cards</a>
        <a>Memory Cards</a>
        <a>Smart Headphones</a>
        <a>Mobile Cables</a>
        <a>Mobile Chargers</a>
        <a>Mobile Holders</a>
      </div>

      <div class="elec2">
        <a>Laptops<i class="fas fa-caret-down"></i></a>
        <a>Gaming Laptops</a>
        <a>Office-Work Laptops</a>
        <a>Mid-Range Laptops</a>
      </div>

      <div class="elec3">
        <a>Desktop PCs<i class="fas fa-caret-down"></i></a>
        <a>Gaming PCs</a>
        <a>Office PCs</a>
        <a>Workstation PCs</a>
        <a>Budget PCs</a>
      </div>
    </div>
</div>

<div class="cat_home_appliances">
  <button>Home Appliances</button>
    <div class="home1">
      <a>one</a>
      <a>two</a>
      <a>three</a>
  </div>
</div>
Как я уже говорил ранее в комментариях, ваш div cat_electronics был установлен в абсолютное положение. При создании выпадающего меню при наведении курсора сама кнопка должна быть статической, а меню, в котором она отображается и скрывается, должно быть абсолютным. Другая проблема заключается в том, что вы не скрывали ни одной подкатегории, кроме .elec, с отображением none, вы просто убрали их с пути, используя отрицательное поле, так что elec1 на самом деле все еще там, и он перекрывает «кнопку» вашей бытовой техники так, как вы это делали. Ваше наведение настроено (имеется в виду блокировку дисплея в любое время, когда ваша кнопка или любая подкатегория находится под навесом) отображало его всякий раз, когда вы пытались навести указатель мыши на Бытовая техника, потому что технически вы наводите курсор на элемент elec1, из-за которого отображается меню, потому что это подкатегория cat_electronics. (см. изображение ниже) Я надеюсь, что это имеет смысл, и я надеюсь, что это поможет вам при создании будущих выпадающих меню

elec1 is overlapping your button

0
ответ дан KJEK-Code 16 January 2019 в 20:09
поделиться