|
|
| (347 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) |
| Zeile 1: |
Zeile 1: |
| <style>
| |
| :root {
| |
| --form-control-color: rebeccapurple;
| |
| --form-control-disabled: #959495;
| |
| }
| |
|
| |
|
| | | __NICHT_INDEXIEREN__ |
| input[type="checkbox"] {
| |
| /* Add if not using autoprefixer */
| |
| -webkit-appearance: none;
| |
| /* Remove most all native input styles */
| |
| appearance: none;
| |
| /* For iOS < 15 */
| |
| background-color: var(--form-background);
| |
| /* Not removed via appearance */
| |
| margin: 0;
| |
| | |
| font: inherit;
| |
| color: currentColor;
| |
| width: 1.15em;
| |
| height: 1.15em;
| |
| border: 0.15em solid currentColor;
| |
| border-radius: 0.15em;
| |
| transform: translateY(-0.075em);
| |
| | |
| display: grid;
| |
| place-content: center;
| |
| }
| |
| | |
| input[type="checkbox"]::before {
| |
| content: "";
| |
| width: 0.65em;
| |
| height: 0.65em;
| |
| clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
| |
| transform: scale(0);
| |
| transform-origin: bottom left;
| |
| transition: 120ms transform ease-in-out;
| |
| box-shadow: inset 1em 1em var(--form-control-color);
| |
| /* Windows High Contrast Mode */
| |
| background-color: CanvasText;
| |
| }
| |
| | |
| input[type="checkbox"]:checked::before {
| |
| transform: scale(1);
| |
| }
| |
| | |
| input[type="checkbox"]:focus {
| |
| outline: max(2px, 0.15em) solid currentColor;
| |
| outline-offset: max(2px, 0.15em);
| |
| }
| |
| | |
| input[type="checkbox"]:disabled {
| |
| --form-control-color: var(--form-control-disabled);
| |
| | |
| color: var(--form-control-disabled);
| |
| cursor: not-allowed;
| |
| }
| |
| | |
| </style>
| |
| | |
| <html>
| |
| <form method="post" action="/Tests/Post" style="font-family: system-ui, sans-serif;">
| |
| <fieldset>
| |
| <legend>Checkliste</legend>
| |
| <input type="checkbox" name="favorite_pet" value="Cats" onclick="return ValidatePetSelection();"> Räumlichkeiten zeigen<br>
| |
| <input type="checkbox" name="favorite_pet" value="Dogs" onclick="return ValidatePetSelection();"> Unterscheidung zwischen allgemeinen Gegenständen und privaten<br>
| |
| <input type="checkbox" name="favorite_pet" value="Birds" onclick="return ValidatePetSelection();"> Finanzierung der Kometin -> Wir sind ein Kulturverein 1)<br>
| |
| <input type="checkbox" name="favorite_pet" value="Birds" onclick="return
| |
| ValidatePetSelection();"> Spendengläser , Getränke-Stricherliste, Einkaufs-liste zeigen <br>
| |
| <input type="checkbox" name="favorite_pet" value="Birds" onclick="return
| |
| ValidatePetSelection();"> Momo und Killing vorstellen, zeigen wo Katzenleckerlis sind<br>
| |
| <input type="checkbox" name="favorite_pet" value="Birds" onclick="return
| |
| ValidatePetSelection();"> Selbstorganisation erklären Heterarchie statt Hierarchie siehe 2)<br>
| |
| <input type="checkbox" name="favorite_pet" value="Birds" onclick="return
| |
| ValidatePetSelection();"> Eigenverantwortung erklären -> gemeinsame Nutzung und Verwaltung <br>
| |
| <input type="checkbox" name="favorite_pet" value="Birds" onclick="return
| |
| ValidatePetSelection();"> Aufgabenverteilung erklären 3) <br>
| |
| <br>
| |
| <input type="submit" value="Submit now">
| |
| </fieldset>
| |
| </form>
| |
| | |
| <p id="geschafft"> nachricht </p>
| |
| <html>
| |
| <h1></h1>
| |
| | |
| <form action="/action_page.php">
| |
| <input type="checkbox" id="room" name="room" value="room">
| |
| <label for="room">Alle Räumlichkeiten zeigen: Garten, Küche, Wohnzimmer, Atelier, Badezimmer</label><br>
| |
| | |
| <input type="checkbox" id="vehicle2" name="vehicle2" value="Car">
| |
| <label for="vehicle2"> I have a car</label><br>
| |
| <input type="checkbox" id="vehicle3" name="vehicle3" value="Boat">
| |
| <label for="vehicle3"> I have a boat</label><br><br>
| |
| <input type="submit" value="Submit">
| |
| </form>
| |
| <script>
| |
| var room = document.getElementById("room").checked;
| |
| let checkbox = document.querySelector("input[id=room]");
| |
| | |
| checkbox.addEventListener('change', function() {
| |
| if (this.checked) {
| |
| console.log("room is checked..");
| |
| } else {
| |
| console.log("room is not checked..");
| |
| }
| |
| });
| |
| | |
| | |
| | |
| <script type="text/javascript">
| |
| | |
| function ValidatePetSelection()
| |
| {
| |
| var geschafft = document.getElementsById("geschafft");
| |
| var checkboxes = document.getElementsByName("favorite_pet");
| |
| var numberOfCheckedItems = 0;
| |
| for(var i = 0; i < checkboxes.length; i++)
| |
| {
| |
| if(checkboxes[i].checked)
| |
| numberOfCheckedItems++;
| |
| }
| |
| if(numberOfCheckedItems === 3)
| |
| {
| |
| geschafft.text = "supa";
| |
| return false;
| |
| }
| |
| }
| |
| </script>
| |
| </script>
| |
| </html>
| |
| # Kometin finanziert sich durch Mitgliedsbeiträge und Spenden. Mitgliedsbeiträge sind keine Miete, Entgelt für die Nutzung der Kometin!
| |
| # https://de.wikipedia.org/wiki/Selbstorganisation : Selbstorganisation ist eine Form der Systementwicklung, bei der formgebende oder gestaltende Einflüsse bei der „Evolution“ von Systemen von seinen Elementen selbst ausgehen. oda so ähnlich 😉
| |
| # Um die Herausforderungen der Selbstorganisation werden Aufgaben fair verteilt. Als Mitglied übernimmt man eine oder mehrere Aufgaben.
| |
