Problème avec ma checkbox
Nymos Le 21 juillet 2017 à 00:58 (Édité le 25 janvier 2019 à 17:53)
Bonjour j'ai créer un checkbox mes j'aimerais que lorsque un bouton est coché sa m'ouvre un lien web. J'attend vos aides généreuse avec impatience :D
<form>
<h3>Détails</h3>
<label>
<!-- Keep the input inside the label -->
<input type="checkbox" >
<!-- make sure the .label-text is right next to the input-->
<span class="label-text">Mode nuit</span>
</label><br>
<label>
<input type="checkbox">
<span class="label-text">English</span>
</label>
</form>
<style>
@import "https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css";
body {
padding: 30px 50px;
font-family: "Helvetica", sans-serif;
}
label {
cursor:pointer;
color: #292929;
}
input[type="checkbox"] {
display: none;
}
input[type="checkbox"] + .label-text:before {
content: "\f096";
font-family: "FontAwesome";
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
width: 1em;
display: inline-block;
margin-right: 5px;
}
input[type="checkbox"]:checked + .label-text:before {
content: "\f14a";
color: #06a3e9;
-webkit-animation:tick 180ms ease-in;
animation:tick 180ms ease-in;
}
input[type="checkbox"]:disabled + .label-text {
color: #aaa;
}
input[type="checkbox"]:disabled + .label-text:before {
content: "\f0c8";
color: #ccc;
}
@-webkit-keyframes tick {
0% {-webkit-transform: scale(0); }
90% {-webkit-transform: scale(1.4); }
100% {-webkit-transform: scale(1); }
}
@keyframes tick {
0% {transform: scale(0); }
90% {transform: scale(1.4); }
100% {transform: scale(1); }
}
</style>
