I have a list of custom checkbox. But when I check a item in that list. All other items will be uncheck(if checked). I've checked with Visual Event in that page but can not found any event attached to that checkboxes.
Code here:
/*Css for checkbox*/
.checkbox {
margin: 13px 4px 13px 25px;
}
.block-content-body input[type=checkbox] {
display: none;
}
.block-content-body label:before {
content: "";
display: inline-block;
width: 18px;
height: 18px;
vertical-align: middle;
background-color: #333333;
color: #f3f3f3;
text-align: center;
border: 2px #FFFFFF solid;
margin-left: 5px;
}
.block-content-body input[type=checkbox]:checked+label:before {
content: "✓";
color: #efef0c;
font-size: 15px;
font-weight: bold;
margin-left: 5px;
HTML
<div class="block-content-body">
<ul style="list-style-type: none">
<li>
<div class="checkbox">
<input id="op1" type="checkbox" name="options" value="1" /> <label
for="op1"> Rapport Global + Graphes</label>
</div>
</li>
<li>
<div class="checkbox">
<input id="op2" type="checkbox" name="options" value="2" /> <label
for="op2"> Relevé des index</label>
</div>
</li>
<li>
<div class="checkbox">
<input id="op3" type="checkbox" name="options" value="3" /> <label
for="op3"> Cleanergie</label>
</div>
</li>
<li>
<div class="checkbox">
<input id="op4" type="checkbox" name="options" value="4" /> <label
for="op4"> X-Fi</label>
</div>
</li>
<li>
<div class="checkbox">
<input id="op5" type="checkbox" name="options" value="5" /> <label
for="op5"> Détail de production</label>
</div>
</li>
<li>
<div class="checkbox">
<input id="op6" type="checkbox" name="options" value="6" /> <label
for="op6"> Ticket de production</label>
</div>
</li>
</ul>
</div>
Aucun commentaire:
Enregistrer un commentaire