Vi har ca 36m² gräsmatta så vi köpte en som klarar 600m² – det borde räcka… (det var på extrapris).
Nu har vi i vart fall en. Jag ville börja ’installera’ den direkt – men frun ville fundera lite.
Det visade sig att placeringen av laddstationen (huset) inte kunde göras hur som helst. Det skulle vara 2m fritt framför och 1m bakom och så skulle den placeras i ’längdriktningen’.
När ’roboten’ letar sig tillbaka till laddstationen gör den den moturs. Vilket innebär att ’ingången’ ska placeras i förhållande till det.
Ingången åt höger alltså.
Jag hade ju givetvis en given placering – hustrun har tre…
Jag får stella meg. Det var ju ändå hustruns idé det här med en robotgräsklippare.
Vi ska investera i ett regnskydd till den också.

HTML (är det som jag kan lägga in i själva inlägget):
<div class="slidecontainer">
<input type="range" min="1" max="100"
value="50" class="slider" id="myRange">
</div>
>: Ev kommer jag att lägga in en mer ’färgrik’ bakgrund – så att det ska vara lättare att välja besvärsläge.
Men – det känns som att jag borde ’låsa’ de sliders jag gör för egen del – och vad gör de då för nytta?
Och deras respektive värde behöver sparas – lättåtkomligt – när jag ’sätter’ det…
Vad många frågor det blev…?
Det lutar ju mer åt att jag har den här funktionen när jag redigerar ’skapar’ inlägget och sedan vid publiceringen kan jag ju visa en färg-’stapel’ med valt ’värde’ markerat.

CSS (style) – Lägger jag i ’Extra CSS’:
.slidecontainer {
width: 100%; /* Bredden på den omgivande
containern (div) */
}

/* Själva slidern */
.slider {
-webkit-appearance: none; /* Skippa
standard CSS style */
appearance: none;
width: 100%; /* Hela bredden */
height: 15px; /* Bestämd höjd */
border-radius; 5px; /* storleken på knappen */
background: #d3d3d3; /* Grå bakgrund */
outline: none; /* Ingen ram */
opacity: 0.7; /* Sätt genomskinlighet (för
mouse-over effekt vid håll-över) */
-webkit-transition: .2s; /* 0.2 sekunders
varaktighet vid håll-över */
transition: opacity .2s; /* genomskinligheten */
}

/* Mus-över effkter */
.slider:hover {
opacity: 1; /* Visa helt när musen kommer över
*/
}

/* Hantera slidern för (använd -webkit- (Chrome, Opera,
Safari, Edge) och -moz- (Firefox) kör över det gällande) */
.slider::-webkit-slider-thumb {
-webkit-appearance: none; /* Åsidosätt
standardutseendet */
appearance: none;
width: 25px; /* Sätt en sprcifik bredd */
height: 25px; /* Sätt en specifik höjd */
border-radius: 50%; /* ram-radie */
background: #04AA6D; /* Grön bakgrund */
cursor: pointer; /* När muspekaren kommer över
*/
}

.slider::-moz-range-thumb {
width: 25px; /* Sätt en specifik bredd */
height: 25px; /* Sätt en specifik höjd */
border-radius: 50%; /* ram-radie */
background: #04AA6D; /* Grön bakgrund */
cursor: pointer; /* När muspekaren kommer över
*/
}

JavaScript (det är detta som blir själva ’plug-in’):
var slider = document.getElementById("myRange");
var output = document.getElementById("demo");
output.innerHTML = slider.value; // Visa sliderns
standardvärde

// uppdatera aktuell sliders värde (varje gång du
flyttar sliderns handtag)
slider.oninput = function() {
output.innerHTML = this.value;
}