Test five star

Fungerar som det ska – radioknappar 1-5 som stjärnor

Det vore fantastiskt smidigt om man kan få radioknappar med nummer 1-5 att fungera som five-star-rating utan att man behöver installera extra plugin för det.

Det fungerar i grunden fint med lite enkel CSS: 

Men, jag får det bara att fungera om alla input och label ligger på samma nivå, i samma div. I den här CSS:en kan stjärnor med lägre nummer tändas med den man klickar på. Då känns det som five-star-rating.

Utmaningen – få det att fungera på samma sätt i Elementor Forms

Elementor Forms delar upp radioknapparnas inputs i separata <span>. Det har säkert sina fördelar men då funkar inte längre samma CSS.

Jag förstår inte vad jag behöver göra med CSS:en för att få till det. Hur får jag de andra stjärnorna (input) att känna av vad som händer om användaren klickar på exempelvis stjärna 3 eller 4, inne i span-taggen intill?

Det går fint att markera en ”stjärna”, men vi vill såklart att även stjärnorna med lägre nummer tänds, så att man tänder en till fem stjärnor. Inte bara den markerade stjärnan.

DEN ÄR HÄR! MISSA INTE!

G R A T I S
K U R S

BLI MER KUNNIG OM DINA LÄKEMEDEL!
BÄTTRE EFFEKT AV BEHANDLINGEN OCH STÖRRE SÄKERHET.

UTAN KOSTNAD!

Vi spammar inte! Läs vår integritetspolicy för mer info.

Fredrik Hed

svarar på dina 
läkemedelsfrågor

Fredrik Hed är apotekare och besvarar frågor om läkemedel, kosttillskott och naturmedel.

Missa ingen viktig information

Gör som tusentals andra och prenumerera på våra nyhetsbrev. Det är gratis!

Varje torsdag kväll kommer nyhetsbrevet med alla inlägg från senaste veckan. Ibland kommer också specialutskick om specifika ämnesområden.

21 april 2025