<div class="onoffswitch">//checkbox class with css
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked onClick="changeImage()">//checkbox class with css
<label class="onoffswitch-label" for="myonoffswitch">//checkbox class with css
<div class="onoffswitch-inner"></div>//checkbox class with css
<div class="onoffswitch-switch"></div>//checkbox class with css
</label>
</div>
<script> function changeImage() {
element=document.getElementById('myimage')
if (element.src.match("bulbon")) {
element.src="PIC/WXXL.png";
} else {
element.src="PIC/idea-xxl.png"; }
}
</script>
check box class with css ijust made the swipe button via check box (ON-OFF) when i press on change the image but when come back to off doesn't change
please some one help me
Try this:
HTML
<div class="onoffswitch">
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked onClick="changeImage(this)" />
<label class="onoffswitch-label" for="myonoffswitch">
<div class="onoffswitch-inner"></div>
<div class="onoffswitch-switch"></div>
</label>
</div>
JS
function changeImage(sender) {
element=document.getElementById('myimage');
if (!sender.checked) {
element.src="PIC/WXXL.png";
} else {
element.src="PIC/idea-xxl.png";
}
}
function changeImage() {
checkBox = document.getElementById('myonoffswitch');
element= document.getElementById('myimage') ;
if (checkBox.checked )
{
element.src="PIC/w.png";
}
else
{
element.src="PIC/b.png";
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.