how to click event in css

Question

This works:

.rightone ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
}
.rightone ul li {
    display: block;
    position: relative;
    float:right;
}
.rightone li ul {
    display: none;
}
.rightone ul li a {
    display: block;
    padding: 5px 30px 5px 30px;
    text-decoration: none;
    white-space: nowrap;

}
.rightone ul li li {
    background-color: black;
    border-radius:5px;
    padding: 2%;
}
.rightone ul li a:hover {
    color:#0ef2c4;
}
.rightone li:active ul {
    display: block; 
    text-align: left;
    position: absolute;
}
.rightone li:hover li {
    float: none;
}
.rightone li:hover a {
    color:#0ef2c4;
}
.rightone li:hover li a:hover {
    color:white;
}
.arrow-down {
    width: 0; 
    height: 0; 
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #0ef2c4;
    cursor: pointer;
}

But it work only when i hold... but i need, if i single click show that pop-up again click that arrow it will hide..

My output

I want to move that pop up left side also..

I want like this

https://jsfiddle.net/z4fej7gm/ But i dont know how apply to my project

Please anyone help me.. Thanks in advance

<script> $(".arrow").click(function(){ $(this).toggleClass(".expanded"); }); </script> Basically what this means, is when you click the arrow element, you toggle the CSS Class .expanded (switch this out with your own class). This way you can show or hide elements by clicking. — Maharkus
– Maharkus, Commented May 7, 2015 at 10:42
For the above to work, you will need to attach a JQuery library to your page, either locally or via a CDN such as this one hosted by google <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> — Callum.
– Callum., Commented May 7, 2015 at 10:48
I want like this jsfiddle.net/z4fej7gm But i dont know how apply to my project — appu
– appu, Commented May 7, 2015 at 10:52

Bas Van Eijk · Accepted Answer · 2015-05-07 10:59:21Z

1

Css doesn't support click events

answered May 7, 2015 at 10:59

Bas Van Eijk

834 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to click event in css

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related