[Preview 3 - Field Boolean] Problem with label display

Information about this bug was passed to developers too

I looked all over and I cannot find good Mootools script. there are lot of JQuery but onlyo ne for MooTools. I will correct CSS though.

I looked all over and I cannot find good Mootools script.

then try to check this .. http://davidwalsh.name/iphone-checkboxes-mootools :D

Then try to use the images from this site as well ... (see attachment)

i would suggest to use a "neutral" png for the on-background and introduce a new parameter "color" as a sort of template for the button. Then the user can choose their background color ...

see: http://mattersofgrey.com/png-background-color-change-with-css/

.iPhoneCheckContainer{ position:relative; width:85px; height:27px; cursor:pointer; overflow:hidden;  }

.iPhoneCheckContainer input{ position:absolute; top:5px; left:30px;  }

.iPhoneCheckHandle{ display:block; height:27px; width:39px; cursor:pointer; position:absolute; top:0; left:0;  }

.iPhoneCheckHandle .iPhoneCheckHandleBG{ position:absolute; width:5px; height:100%; top:0; left:0; z-index:1;  }

.iPhoneCheckHandle .iPhoneCheckHandleSlider{ position:absolute; top:0; left:0; height:27px; width:39px; background:url(iphone-slider.png) no-repeat; z-index:2;  }

label.iPhoneCheckLabelOn,label.iPhoneCheckLabelOff{ font-size:17px; line-height:17px; font-weight:bold; font-family:Helvetica Neue,Arial,Helvetica,sans-serif; text-transform:uppercase; cursor:pointer; display:block; height:22px; position:absolute; width:52px; top:0;  }

label.iPhoneCheckLabelOn{ color:#fff; background:url(iphone-on.png) no-repeat; text-shadow:0px 0px 2px rgba(0,0,0,0.6); left:0; padding:5px 0 0 8px;  }

label.iPhoneCheckLabelOff{ color:#8B8B8B; background:url(iphone-off.png) no-repeat right 0; text-shadow:0px 0px 2px rgba(255,255,255,0.6); text-align:right; right:0; padding:5px 8px 0 0;  }

The behavior of the input data was corrected in version 1.1 Soon it will be released