Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <input type="checkbox" value="hello" id="hello" name="deletefiles[]"/>
- <label for="hello">hello</label>
- label:hover, label:active {
- background:yellow;
- }
- label:hover, label:active, input:hover+label, input:active+label {
- background:yellow;
- }
- <label for="hello">
- <input type="checkbox" value="hello" id="hello" name="deletefiles[]"/>
- hello
- </label>
- $(document).ready(function(){
- $('#hello, label[for="hello"]').hover(function(){$(this).addClass('.hover');},
- function(){$(this).removeClass('.hover');});
- });
- ...
- .hover
- {
- background-color: yellow;
- }
- /*CSS*/
- /*-------------------------------------------------*/
- input:not(:checked) + label:hover{
- color: #d51e22;
- cursor: pointer;
- background-color: #bbb;
- }
- input:checked + label[for="tab1"],
- input:checked + label[for="tab2"],
- input:checked + label[for="tab3"],
- input:checked + label[for="tab4"]{
- color: #d51e22;
- text-shadow: 0 0.04em 0.04em rgba(0,0,0,0.35);
- background-color: #000;
- }
- label[for="tab1"],[for="tab2"],[for="tab3"],[for="tab4"] {
- width:24%;
- display: inline-block;
- margin: 0 0 -1px;
- padding: 25px 25px;
- font-weight: 600;
- font-size:24px;
- text-align: center;
- border-radius:15px;
- background-color: #d51e22;
- color: #fff;
- /*border: 1px solid transparent;*/
- }
- /*HTML*/
- /*-------------------------------------------------*/
- <input id="tab1" type="radio" name="tabs" checked>
- <label for="tab1">Text here</label>
- <input id="tab2" type="radio" name="tabs">
- <label for="tab2">Text here</label>
- <input id="tab3" type="radio" name="tabs">
- <label for="tab3">Text here</label>
- <input id="tab4" type="radio" name="tabs">
- <label for="tab4">Text here</label>
Add Comment
Please, Sign In to add comment