1 reply [Last post]
srivers's picture
Last seen: 7 years 17 weeks ago
Timezone: GMT-5
Joined: 2015-03-04
Posts: 1
Points: 2

my goal is to highlight over buttons 1, 2 and 3.
When I highlight over button 1 I want it red bg for example but 2 and 3 grey
when I highlight over button 2 I want it blue bg "" but 1 and 3 grey and
when I highlight over button 3 I want it yellow bg "" but 1 and 2 grey

I have a working code but it only allows me to make all 1 bg colour on hover but I need 3 different bg colours.

so for the code below I almost need to say specify 3 item definitions and include them in hover instructions.

HTML is bar

.bar .item {
background: #a02786;
width: 6%!important;
padding-top: 2.5%!important;
padding-bottom: 2%!important;
box-shadow: -5px -1px 10px #d0b9fb;
border-radius: 50%;
width: 80px;
height: 20px!important;
float: left;
margin-left: 2%;
text-align: center;
color: purple;
font-size: 14px;}

.bar:hover .item:hover {
background: red;}

.bar:hover .item {
background: #ccc;}

Tony's picture
Last seen: 3 weeks 4 days ago
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

If I understand correctly I

If I understand correctly I think you will need to use JavaScript to style the other 2 buttons when you hover over one.