Verktyg Visningsval
2012-07-04, 09:14   #1

flashen

Medlem

flashens avatar

Plats: Summer '79

Registrerad: maj 2002

Div-popup med tooltip? Huvudbry :/


Hallå!

Jag har en lista med olika val i text:

1. asd1
2. asd2
3. asd3

Jag vill att när man för musen över tex 1. asd1 så ska en popup-div hamna precis ovanför där man kan fylla i alternativ (show/hide)

Problemet är att popup-diven stannar på samma ställe och följer inte alternativet i listan, antar att man måste ge en position med nån form av tooltip för att positionen ska ändras till det specifika valet i listan

Skrev ihop nått snabbt, fungerar sådär men ni kanske förstår bättre

http://jsfiddle.net/LnAk5/3/
__________________
CPU: Q9550 @ 3.8Ghz cpu-z Prime95 Mobo: Rampage Formula X48 GPU: Sapphire 5870 Vapor-X Minne: 8GB SSD: 80GB Intel G2 MacBook Pro: 13" -2010 Foto: www.nordfoto.se Stream-projekt: www.streamwoo.com
flashen är inte uppkopplad Folding
2012-07-04, 17:10   #2

Lackevafan

Medlem

Lackevafans avatar

Plats: Tillberga, Västerås

Registrerad: dec 2009

Citat:
Ursprungligen inskrivet av flashen Visa inlägg
Hallå!

Jag har en lista med olika val i text:

1. asd1
2. asd2
3. asd3
....
Om jag förstår rätt så vill du helt enkelt att en popup ska komma när du har musen över ett val i listan? Det kan du göra helt i CSS. Kolla det jag slängde ihop här så förstår du kanske hur det fungerar http://jsfiddle.net/Lackevafan/W6tVe/ . Kan förklara lite mer hur det fungerar om du inte förstår
Lackevafan är inte uppkopplad
2012-07-05, 13:49   #3

flashen

Medlem

flashens avatar

Plats: Summer '79

Registrerad: maj 2002

Citat:
Ursprungligen inskrivet av Lackevafan Visa inlägg
Om jag förstår rätt så vill du helt enkelt att en popup ska komma när du har musen över ett val i listan? Det kan du göra helt i CSS. Kolla det jag slängde ihop här så förstår du kanske hur det fungerar http://jsfiddle.net/Lackevafan/W6tVe/ . Kan förklara lite mer hur det fungerar om du inte förstår
Coolt ska kolla på det ikväll efter jobb

EDIT: Fungerar perfekt, ibland är de enkla lösningarna med CSS bäst stirrade mig helt blind på JQ-lösning

Senast redigerad av flashen 2012-07-05 klockan 17:09.
__________________
CPU: Q9550 @ 3.8Ghz cpu-z Prime95 Mobo: Rampage Formula X48 GPU: Sapphire 5870 Vapor-X Minne: 8GB SSD: 80GB Intel G2 MacBook Pro: 13" -2010 Foto: www.nordfoto.se Stream-projekt: www.streamwoo.com
flashen är inte uppkopplad Folding
2012-07-25, 23:28   #4

kismo

Medlem

kismos avatar

Registrerad: okt 2004

Citat:
Ursprungligen inskrivet av Lackevafan Visa inlägg
Om jag förstår rätt så vill du helt enkelt att en popup ska komma när du har musen över ett val i listan? Det kan du göra helt i CSS. Kolla det jag slängde ihop här så förstår du kanske hur det fungerar http://jsfiddle.net/Lackevafan/W6tVe/ . Kan förklara lite mer hur det fungerar om du inte förstår
Såhär kan man också göra. Enligt mig bättre: http://jsfiddle.net/W6tVe/22/
kismo är inte uppkopplad
2012-07-27, 13:18   #5

flashen

Medlem

flashens avatar

Plats: Summer '79

Registrerad: maj 2002

Citat:
Ursprungligen inskrivet av kismo Visa inlägg
Såhär kan man också göra. Enligt mig bättre: http://jsfiddle.net/W6tVe/22/
Intressant

Vad gör "content: attr(data-popup);" för något?

Inte sett den taggen innan
__________________
CPU: Q9550 @ 3.8Ghz cpu-z Prime95 Mobo: Rampage Formula X48 GPU: Sapphire 5870 Vapor-X Minne: 8GB SSD: 80GB Intel G2 MacBook Pro: 13" -2010 Foto: www.nordfoto.se Stream-projekt: www.streamwoo.com
flashen är inte uppkopplad Folding
2012-07-27, 23:17   #6

kismo

Medlem

kismos avatar

Registrerad: okt 2004

Citat:
Ursprungligen inskrivet av flashen Visa inlägg
Intressant

Vad gör "content: attr(data-popup);" för något?

Inte sett den taggen innan
Det jag gör är att jag deklarerar ett så kallat pseudo-element i CSS-koden med :after. Med det kan du placera ut element som inte syns i HTML-koden före (:before) eller efter (:after) elementet. "content"-egenskapen bestämmer vad för innehåll som ska finnas innan eller efter elementet.

Du kan skriva t.ex. content: 'HEJSAN'; men man kan också använda ett attribut från elementet, vilket man gör med attr(*attributet här*); och i det här fallet är det data-popup som jag vill använda.
kismo är inte uppkopplad
Senaste nyheterna

Redaktionens senaste nyhetsrubriker

Sök jobb