TIA s7 Webserver

Rechi

Level-2
Beiträge
49
Reaktionspunkte
6
Zuviel Werbung?
-> 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.
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:
Zurück
Oben