Recommended Posts

Добрый вечер, ребята.

 

Вторые сутки блуждаю в сети и не могу найти ответ на свой вопрос. 

.niz:hover {
  background: red;  

этим кодом я получил возможность менять цвет определенного блока наведением курсора, вопрос в следующем. 

Как делать, что бы после каждого наведения цвет менялся на другой а не на один и тот же. То есть зеленый, красный, оранжевый и так далее, спасибо большое

Share this post


Link to post
Share on other sites

Здравствуйте.

Для реализации такой задачи Вам требуется для каждого <div> задать уникальный класс.

<div class="niz red"></div>
<div class="niz blue"></div>
<div class="niz green"></div>
.niz.red {
    background: red;
}
.niz.blue {
    background: blue;
}
.niz.green {
    background: green;
}

 

Share this post


Link to post
Share on other sites

мне кажется тут вам нужно будет использовать js
если взять за основу предложенный вариант @klierik, для элемента на который вы будете наводить менять класс цвета или создать какой-нибудь атрибут data- 
https://jsfiddle.net/7g8cdwqj/

Share this post


Link to post
Share on other sites
20.11.2019 в 12:20, Switch74 сказал:

мне кажется тут вам нужно будет использовать js
если взять за основу предложенный вариант @klierik, для элемента на который вы будете наводить менять класс цвета или создать какой-нибудь атрибут data- 
https://jsfiddle.net/7g8cdwqj/

Мне помог ответ я Вам благодарен )))

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Govt_sm80
      Привет всем .Может кто-то сможет помочь, я не знаю как подвинуть span А. сделать его круглым и поставить по центру картинки , как в премере на картинке.Спасибо за ранее.https://jsfiddle.net/m05gfxqb/1/


      css DZ.zip
    • By lokonaft
      Люди добрые, помогите разобраться, весь день пытаюсь понять почему у меня не получается.
      В общем идея была сделать одну красную кнопку, чтобы при наведении появлялось еще 4 зеленых.
      Реализовать попытался 2мя очень похожими способами, через div и через список.
      https://codepen.io/lokonaft/pen/GXqBBP - в данном случае почему то не работает transition
      https://codepen.io/lokonaft/pen/qMNMVL - в данном случае я то ли не могу правильно задать hover, то ли я чего то не понимаю
    • By Denzell97
      Здравствуйте. Недавно начал изучать HTML и CSS. Хочу сделать рядом 2 блока div которые при наведении на любой из них увеличивались в ширине  и изменяли ширину соседнего.
      А получается что при  наведении на блок А он увеличивается и уменьшает ширину блока Б. А при наведении на блок Б он просто увеличивается и перекрывает блок А
       
      https://jsfiddle.net/ob4jyz0p/1/
      Для наглядности:
      Курсор не в области этих блоков:
      |________А_50%________| |________Б_50%________|
      Курсор наведен на блок А:
      |____________А_80%____________| |____Б_20%____|
      Курсор наведен на блок Б: (Перекрывает Блок А)
      |____А_50%____|____________Б_80%____________|
  • Member Statistics

    46,546
    Total Members
    3,128
    Most Online
    asd_rojd
    Newest Member
    asd_rojd
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.