Rechi
Level-2
- Beiträge
- 49
- Reaktionspunkte
- 6
-> Hier kostenlos registrieren
Guten Tag,
Ich habe einen schönen Schalter gefunden mit dem ich ein Merker ansteuern möchte und zur SPS senden, habe eine CPU 1212C, mit Buttons
funktioniert alles bestens nun möchte ich den Schalter Benutzen. Aber wie? kann mir vielleicht jemand helfen.
Danke im Voraus
Ich habe einen schönen Schalter gefunden mit dem ich ein Merker ansteuern möchte und zur SPS senden, habe eine CPU 1212C, mit Buttons
funktioniert alles bestens nun möchte ich den Schalter Benutzen. Aber wie? kann mir vielleicht jemand helfen.
Code:
<!-- AWP_In_Variable Name='"Start_4"' -->
<div class="onoffswitch">
<input type="checkbox" name='"Start_4"' class="onoffswitch-checkbox" id="myonoffswitch" value="1">
<label class="onoffswitch-label" for="myonoffswitch">
<div class="onoffswitch-inner" ></div>
<div class="onoffswitch-switch" ></div>
</label>
</div>
CODE in CSS
/* SCHALTER BEGIN */
.onoffswitch {
position: relative; width: 90px;
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
display: block;
}
.onoffswitch-label {
display: block; overflow: hidden; cursor: pointer;
border: 2px solid #999999; border-radius: 20px;
}
.onoffswitch-inner {
width: 200%; margin-left: -100%;
-moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s;
-o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.onoffswitch-inner:before {
content: "ON";
padding-left: 10px;
background-color: #2FCCFF; color: #FFFFFF;
}
.onoffswitch-inner:after {
content: "OFF";
padding-right: 10px;
background-color: #EEEEEE; color: #999999;
text-align: right;
}
.onoffswitch-switch {
width: 18px; margin: 6px;
background: #FFFFFF;
border: 2px solid #999999; border-radius: 20px;
position: absolute; top: 0; bottom: 0; right: 56px;
-moz-transition: all 0.3s ease-in 0s; -webkit-transition: all 0.3s ease-in 0s;
-o-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
right: 0px;
}
/* SCHALTER END */
Danke im Voraus
Zuletzt bearbeitet: