|
| Spørgsmål om 'span title' Fra : Lisbet Laursen |
Dato : 24-09-08 16:17 |
|
Se http://lisbetovervad.dk/artikler.html
Her har jeg lavet en 'span title' på overskriften 'Artikler':
<span title="Kendeord">Artikler</span>
Så dukker disse to spørgsmål op:
1. Kan jeg via css formatere den boks der dukker op, så den fx bliver
større, får en anden farve osv.?
2. Kan jeg få pointeren til at blive en hånd (eller andet)?
--
Med venlig hilsen
Lisbet
| |
Bertel Lund Hansen (24-09-2008)
| Kommentar Fra : Bertel Lund Hansen |
Dato : 24-09-08 16:56 |
|
Lisbet Laursen skrev:
> <span title="Kendeord">Artikler</span>
> Så dukker disse to spørgsmål op:
> 1. Kan jeg via css formatere den boks der dukker op, så den fx bliver
> større, får en anden farve osv.?
Nej. Det er browseren der bestemmer det udseende.
> 2. Kan jeg få pointeren til at blive en hånd (eller andet)?
Ja, men lad endelig være med det. Når du fifler med velkendte
redskaber, forvirrer du dine brugere.Hvis der dukker linkhænder
op ved noget der ikke er et link, så ved man ikke hvad man kan
regne med.
Jeg har glemt kommandoen fordi jeg aldrig bruger det.
Jeg have engang samme problem som dig. Jeg ville stille en
forklaring pænt op i en title-boks, men det kan man bare ikke.
Jeg endte med at lave en separat HTML-side der kan åbnes som en
popop eller som en normal side. Du kan se det her:
http://fiduso.dk/?page=medlemmer
ved "Eksempler på søgninger" og "(popop)". Jeg lavede det
valgfrit for at folk selv kunne bestemme. Nogle spærrer f.eks.
for popop.
--
Bertel
http://bertel.lundhansen.dk/ FIDUSO: http://fiduso.dk/
| |
Lisbet Laursen (24-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 24-09-08 17:11 |
|
Bertel Lund Hansen wrote:
> Lisbet Laursen skrev:
>
>> <span title="Kendeord">Artikler</span>
>
>> Så dukker disse to spørgsmål op:
>
>> 1. Kan jeg via css formatere den boks der dukker op, så den fx
>> bliver
>> større, får en anden farve osv.?
>
> Nej. Det er browseren der bestemmer det udseende.
Okay. Jeg kan se at man via javascript kan lave det jeg eftersøger,
fx her:
http://blog.innerewut.de/2006/10/19/a-prototype-based-javascript-tooltip.
Men det er vist at gøre for meget ud af det.
>
>> 2. Kan jeg få pointeren til at blive en hånd (eller andet)?
>
> Ja, men lad endelig være med det. Når du fifler med velkendte
> redskaber, forvirrer du dine brugere.Hvis der dukker linkhænder
> op ved noget der ikke er et link, så ved man ikke hvad man kan
> regne med.
Det lyder rimeligt nok: Men kunne man ikke lave en alternativ pil?
> Jeg have engang samme problem som dig. Jeg ville stille en
> forklaring pænt op i en title-boks, men det kan man bare ikke.
> Jeg endte med at lave en separat HTML-side der kan åbnes som en
> popop eller som en normal side. Du kan se det her:
>
> http://fiduso.dk/?page=medlemmer
>
> ved "Eksempler på søgninger" og "(popop)". Jeg lavede det
> valgfrit for at folk selv kunne bestemme. Nogle spærrer f.eks.
> for popop.
Det var jo en løsning, men måske for omstændelig (for brugeren) i mit
tilfælde.
Tak for forslagene!
--
Med venlig hilsen
Lisbet
| |
Kerim Ellentoft (24-09-2008)
| Kommentar Fra : Kerim Ellentoft |
Dato : 24-09-08 16:59 |
|
"Lisbet Laursen" <lisbet.olnospam@gmail.com> skrev :
>1. Kan jeg via css formatere den boks der dukker op, så den fx bliver
>større, får en anden farve osv.?
Nej, det er en del af styresystemets opsætning, så det er her det
skal ændres.
Eller kan du ty til noget javascript, der forskellige muligheder
på http://dynamicdrive.com/dynamicindex5/index.html
>2. Kan jeg få pointeren til at blive en hånd (eller andet)?
cursor: pointer
--
Kerim
| |
Philip Nunnegaard (24-09-2008)
| Kommentar Fra : Philip Nunnegaard |
Dato : 24-09-08 17:08 |
|
"Lisbet Laursen" <lisbet.olnospam@gmail.com> skrev i
> 2. Kan jeg få pointeren til at blive en hånd (eller andet)?
Hvis det er noget med en hjælpetekst der popper frem (f.eks. via title,
sådan som du har lavet det), kan det evt. gøres sådan:
<span class="hjaelp" title="Kendeord">Artikler</span>
CSS:
..hjaelp {
border-bottom: 1px dotted #000;
cursor: help;
}
Jeg foretrækker at hånden udelukkende kommer frem hvis det er et link.
Derfor har jeg valgt "help" i stedet.
Musemarkøren bliver da til et spørgsmålstegn.
| |
Lisbet Laursen (24-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 24-09-08 17:16 |
|
Philip Nunnegaard wrote:
> "Lisbet Laursen" <lisbet.olnospam@gmail.com> skrev i
>
>> 2. Kan jeg få pointeren til at blive en hånd (eller andet)?
>
> Hvis det er noget med en hjælpetekst der popper frem (f.eks. via
> title, sådan som du har lavet det), kan det evt. gøres sådan:
>
> <span class="hjaelp" title="Kendeord">Artikler</span>
>
> CSS:
> .hjaelp {
> border-bottom: 1px dotted #000;
> cursor: help;
> }
>
> Jeg foretrækker at hånden udelukkende kommer frem hvis det er et
> link.
> Derfor har jeg valgt "help" i stedet.
>
> Musemarkøren bliver da til et spørgsmålstegn.
Det er en rigtig god ide at lave den til et spørgsmålstegn. Det vil
jeg prøve. Tak for forslaget!
--
Med venlig hilsen
Lisbet
| |
Birgit Holme (24-09-2008)
| Kommentar Fra : Birgit Holme |
Dato : 24-09-08 17:23 |
|
Lisbet Laursen wrote in dk.edb.internet.webdesign.html:
>
> Det er en rigtig god ide at lave den til et spørgsmålstegn. Det vil
> jeg prøve. Tak for forslaget!
>
> --
> Med venlig hilsen
> Lisbet
>
>
Hvis du vil have andre muligheder end ? så kig her
http://www.w3schools.com/CSS/tryit.asp?filename=trycss_cursor
/Birgit
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Lisbet Laursen (24-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 24-09-08 18:39 |
| | |
Lisbet Laursen (24-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 24-09-08 18:35 |
|
Lisbet Laursen wrote:
> Philip Nunnegaard wrote:
>> "Lisbet Laursen" <lisbet.olnospam@gmail.com> skrev i
>>
>>> 2. Kan jeg få pointeren til at blive en hånd (eller andet)?
>>
>> Hvis det er noget med en hjælpetekst der popper frem (f.eks. via
>> title, sådan som du har lavet det), kan det evt. gøres sådan:
>>
>> <span class="hjaelp" title="Kendeord">Artikler</span>
>>
>> CSS:
>> .hjaelp {
>> border-bottom: 1px dotted #000;
>> cursor: help;
>> }
> Det er en rigtig god ide at lave den til et spørgsmålstegn. Det vil
> jeg prøve. Tak for forslaget!
Nu har jeg afprøvet dit forslag, men kan ikke få det til at virke.
Derimod virker opskriften fra W3C schools:
http://www.w3schools.com/CSS/tryit.asp?filename=trycss_cursor.
Det sidste har jeg prøvet i overskriften Artikler, det første næste
gang ordet forekommer i teksten.
--
Med venlig hilsen
Lisbet
| |
Bertel Lund Hansen (24-09-2008)
| Kommentar Fra : Bertel Lund Hansen |
Dato : 24-09-08 17:16 |
|
Philip Nunnegaard skrev:
> Musemarkøren bliver da til et spørgsmålstegn.
Ja okay, det er et godt valg. Det karambolerer ikke med de
vigtige cursorsymboler. Det vil jeg skrive mig bag øret.
--
Bertel
http://bertel.lundhansen.dk/ FIDUSO: http://fiduso.dk/
| |
Birger Sørensen (24-09-2008)
| Kommentar Fra : Birger Sørensen |
Dato : 24-09-08 18:55 |
|
Den 24-09-2008, skrev Lisbet Laursen:
> Se http://lisbetovervad.dk/artikler.html
>
> Her har jeg lavet en 'span title' på overskriften 'Artikler':
>
> <span title="Kendeord">Artikler</span>
>
> Så dukker disse to spørgsmål op:
>
> 1. Kan jeg via css formatere den boks der dukker op, så den fx bliver større,
> får en anden farve osv.?
>
> 2. Kan jeg få pointeren til at blive en hånd (eller andet)?
Man må kunne bruge samme teknik som til popup menuer, og styre
"titel-tingen" med :hover via css.
Din tekst til title skal så stå i et absolut positioneret div, som
vises/skjules når musen er over din span.
Har ikke forsøgt på den måde, men det virker med ul og li i menuer, så
det må det også kunne bringes til med andre elementer...
Birger
| |
Lisbet Laursen (24-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 24-09-08 19:40 |
|
Birger Sørensen wrote:
> Den 24-09-2008, skrev Lisbet Laursen:
>> Se http://lisbetovervad.dk/artikler.html
>>
>> Her har jeg lavet en 'span title' på overskriften 'Artikler':
>>
>> <span title="Kendeord">Artikler</span>
>>
>> Så dukker disse to spørgsmål op:
>>
>> 1. Kan jeg via css formatere den boks der dukker op, så den fx
>> bliver større, får en anden farve osv.?
>>
>> 2. Kan jeg få pointeren til at blive en hånd (eller andet)?
>
> Man må kunne bruge samme teknik som til popup menuer, og styre
> "titel-tingen" med :hover via css.
> Din tekst til title skal så stå i et absolut positioneret div, som
> vises/skjules når musen er over din span.
Tak for forslaget, men det lyder lidt for indviklet for mig. Der er
tale om mange gange hvor "titel-tingen" skal vises på samme side, men
ofte med forskellig tekst, og jeg er ikke med på den absolut
positionerede div i den forbindelse.
--
Med venlig hilsen
Lisbet
| |
Birger Sørensen (24-09-2008)
| Kommentar Fra : Birger Sørensen |
Dato : 24-09-08 21:01 |
|
Lisbet Laursen:
> Birger Sørensen wrote:
>> Den 24-09-2008, skrev Lisbet Laursen:
>>> Se http://lisbetovervad.dk/artikler.html
>>>
>>> Her har jeg lavet en 'span title' på overskriften 'Artikler':
>>>
>>> <span title="Kendeord">Artikler</span>
>>>
>>> Så dukker disse to spørgsmål op:
>>>
>>> 1. Kan jeg via css formatere den boks der dukker op, så den fx
>>> bliver større, får en anden farve osv.?
>>>
>>> 2. Kan jeg få pointeren til at blive en hånd (eller andet)?
>>
>> Man må kunne bruge samme teknik som til popup menuer, og styre
>> "titel-tingen" med :hover via css.
>> Din tekst til title skal så stå i et absolut positioneret div, som
>> vises/skjules når musen er over din span.
>
> Tak for forslaget, men det lyder lidt for indviklet for mig. Der er tale om
> mange gange hvor "titel-tingen" skal vises på samme side, men ofte med
> forskellig tekst, og jeg er ikke med på den absolut positionerede div i den
> forbindelse.
Essentielt er det det samme som Jørgens onmouseover, som nok også er
mindre indviklet. ;>)
Birger
| |
Jørgen Farum Jensen (24-09-2008)
| Kommentar Fra : Jørgen Farum Jensen |
Dato : 24-09-08 19:42 |
| | |
Lisbet Laursen (24-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 24-09-08 21:35 |
|
Jørgen Farum Jensen wrote:
> Lisbet Laursen skrev:
>> Se http://lisbetovervad.dk/artikler.html
>>
>> Her har jeg lavet en 'span title' på overskriften 'Artikler':
>>
>> <span title="Kendeord">Artikler</span>
>>
>> Så dukker disse to spørgsmål op:
>>
>> 1. Kan jeg via css formatere den boks der dukker op, så den fx
>> bliver
>> større, får en anden farve osv.?
>
> Det har du fået svar på. Her er nogle tips
> til hvad du ellers kan gøre:
> http://webdesign101.dk/showcase/visogskjul/index.php
Det ser smart ud. Skal der i <head> et script for hver note eller
hvordan? Jeg tænker på mouseover-metoden.
--
Med venlig hilsen
Lisbet
| |
Jørgen Farum Jensen (24-09-2008)
| Kommentar Fra : Jørgen Farum Jensen |
Dato : 24-09-08 22:26 |
|
Lisbet Laursen skrev:
> Jørgen Farum Jensen wrote:
>> Lisbet Laursen skrev:
>>> Se http://lisbetovervad.dk/artikler.html
>>>
>>> Her har jeg lavet en 'span title' på overskriften 'Artikler':
>>>
>>> <span title="Kendeord">Artikler</span>
>>>
>>> Så dukker disse to spørgsmål op:
>>>
>>> 1. Kan jeg via css formatere den boks der dukker op, så den fx
>>> bliver
>>> større, får en anden farve osv.?
>> Det har du fået svar på. Her er nogle tips
>> til hvad du ellers kan gøre:
>> http://webdesign101.dk/showcase/visogskjul/index.php
>
> Det ser smart ud. Skal der i <head> et script for hver note eller
> hvordan? Jeg tænker på mouseover-metoden.
>
Du skal kun bruge det ene script, der står i
slutningen af ariklen. Det ordner visningen, uanset
hvor mange noter du har. Du skal bare nummerere
dem og passere id'en til dine event handlers:
onmouseover="showNote('note2', true)"
onmouseout="showNote('note2', false)">
--
Med venlig hilsen
Jørgen Farum Jensen
http://webdesign101.dk
| |
Lisbet Laursen (25-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 25-09-08 00:16 |
|
Jørgen Farum Jensen wrote:
>>> Lisbet Laursen skrev:
http://lisbetovervad.dk/artikler.html
http://webdesign101.dk/showcase/visogskjul/index.php
>> Det ser smart ud. Skal der i <head> et script for hver note eller
>> hvordan? Jeg tænker på mouseover-metoden.
> Du skal bare nummerere
> dem og passere id'en til dine event handlers:
> onmouseover="showNote('note2', true)"
> onmouseout="showNote('note2', false)">
Jeg har forsøgt, men det virker ikke, så jeg må have lavet en fejl,
men hvilken?
Jeg forstår heller ikke det du skriver her. Hvor skal jeg nummerere
noterne?
--
Med venlig hilsen
Lisbet
| |
Birgit Holme (25-09-2008)
| Kommentar Fra : Birgit Holme |
Dato : 25-09-08 01:27 |
|
Lisbet Laursen wrote in dk.edb.internet.webdesign.html:
> Jørgen Farum Jensen wrote:
> >> Det ser smart ud. Skal der i <head> et script for hver note eller
> >> hvordan? Jeg tænker på mouseover-metoden.
>
> > Du skal bare nummerere
> > dem og passere id'en til dine event handlers:
> > onmouseover="showNote('note2', true)"
> > onmouseout="showNote('note2', false)">
>
> Jeg har forsøgt, men det virker ikke, så jeg må have lavet en fejl,
> men hvilken?
>
> Jeg forstår heller ikke det du skriver her. Hvor skal jeg nummerere
> noterne?
>
> --
> Med venlig hilsen
> Lisbet
>
Lisbet, prøv at se dette eks. om mouseover, ikke det du helt spørger
om, men måske det kan give dig en ide om hvordan mouseover etc virker.
http://www.w3schools.com/css/tryit.asp?filename=trycss_image_transparen
cy
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Bertel Lund Hansen (25-09-2008)
| Kommentar Fra : Bertel Lund Hansen |
Dato : 25-09-08 05:50 |
| | |
Lisbet Laursen (25-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 25-09-08 16:17 |
|
Birgit Holme wrote:
> Lisbet, prøv at se dette eks. om mouseover, ikke det du helt
> spørger
> om, men måske det kan give dig en ide om hvordan mouseover etc
> virker.
>
> http://www.w3schools.com/css/tryit.asp?filename=trycss_image_transparen
> cy
Tak for linket. Ja, det er i det hele taget nok en god ide at gå mere
flittigt i W3C-skole!
--
Med venlig hilsen
Lisbet
| |
Dennis Munding (25-09-2008)
| Kommentar Fra : Dennis Munding |
Dato : 25-09-08 05:55 |
|
Hej Lisbet!
"Lisbet Laursen" skrev:
> Jeg har forsøgt, men det virker ikke, så jeg må have lavet en fejl, men
> hvilken?
Denne - nuværende kode:
<script type="text/javascript">
function showNote(objekt, onoff) {
if (onoff) {
document.getElementById(objekt).
--> style.display="block"; DENNE LINJE SKAL SÆTTES SAMMEN MED DEN
OVENOVER - FJERN "-->"
}
else {
document.getElementById(objekt).
--> style.display="none"; DENNE LINJE SKAL SÆTTES SAMMEN MED DEN
OVENOVER - FJERN "-->"
}
}
</script>
Så koden kommer til at se således ud (det kan være at din newsreader
ombryder linjerne!):
<script type="text/javascript">
function showNote(objekt, onoff) {
if (onoff) {
document.getElementById(objekt).style.display="block";
} else {
document.getElementById(objekt).style.display="none";
}
}
</script>
>> Du skal bare nummerere
>> dem og passere id'en til dine event handlers:
>> onmouseover="showNote('note2', true)"
>> onmouseout="showNote('note2', false)">
>
> Jeg forstår heller ikke det du skriver her. Hvor skal jeg nummerere
> noterne?
Det skal du i linket:
<span class="trigger" onmouseover="showNote('note1', true)"
onmouseout="showNote('note1', false)">
Du har "showNote('note1', true)" ved det første link...
Du skal så have "showNote('note2', true)" ved det andet link...
Og "showNote('note3', true)" ved det tredje...
O.s.v....
Med venlig hilsen
--
Dennis Munding
http://as-transport.dk/ -Sikker møbeltransport til tiden!
http://pe-vagtservice.dk/ -Når du vil passe på dine værdier!
http://munding-webdesign.dk/ -Vi ses! Ganske enkelt...
| |
Lisbet Laursen (25-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 25-09-08 16:15 |
|
Dennis Munding wrote:
> Hej Lisbet!
> "Lisbet Laursen" skrev:
>> Jeg har forsøgt, men det virker ikke, så jeg må have lavet en
>> fejl,
>> men hvilken?
>
> Denne - nuværende kode:
>
> <script type="text/javascript">
> function showNote(objekt, onoff) {
> if (onoff) {
> document.getElementById(objekt).
> --> style.display="block"; DENNE LINJE SKAL SÆTTES SAMMEN MED DEN
> OVENOVER - FJERN "-->"
> }
> else {
> document.getElementById(objekt).
> --> style.display="none"; DENNE LINJE SKAL SÆTTES SAMMEN MED DEN
> OVENOVER - FJERN "-->"
> }
> }
> </script>
Ups! Jeg havde godt set i Jørgen Farum Jensens "opskrift" at de
der --> skulle fjernes, men glemte det igen.
>> Jeg forstår heller ikke det du skriver her. Hvor skal jeg
>> nummerere
>> noterne?
>
> Det skal du i linket:
> <span class="trigger" onmouseover="showNote('note1', true)"
> onmouseout="showNote('note1', false)">
>
> Du har "showNote('note1', true)" ved det første link...
> Du skal så have "showNote('note2', true)" ved det andet link...
> Og "showNote('note3', true)" ved det tredje...
> O.s.v....
1000 tak til både dig og Jørgen Farum Jensen, nu virker det!
--
Med venlig hilsen
Lisbet
| |
Lisbet Laursen (25-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 25-09-08 19:44 |
|
Lisbet Laursen wrote:
> 1000 tak til både dig og Jørgen Farum Jensen, nu virker det!
Men et nyt spørgsmål dukker op: i IE7 er alle tooltips rigtigt
placeret - i nærheden af "trigger". Men i FF placerer det tredje sig
ude til højre på siden?
--
Med venlig hilsen
Lisbet
| |
Dennis Munding (25-09-2008)
| Kommentar Fra : Dennis Munding |
Dato : 25-09-08 22:17 |
|
Hej Lisbet!
"Lisbet Laursen" skrev:
>> 1000 tak til både dig og Jørgen Farum Jensen, nu virker det!
Det var så lidt...
> Men et nyt spørgsmål dukker op: i IE7 er alle tooltips rigtigt placeret -
> i nærheden af "trigger". Men i FF placerer det tredje sig ude til højre på
> siden?
Fisk!?!
Ikke genkendt - det ser rigtigt ud hos mig - FF3.0.1
Med venlig hilsen
--
Dennis Munding
http://as-transport.dk/ -Sikker møbeltransport til tiden!
http://pe-vagtservice.dk/ -Når du vil passe på dine værdier!
http://munding-webdesign.dk/ -Vi ses! Ganske enkelt...
| |
Lisbet Laursen (26-09-2008)
| Kommentar Fra : Lisbet Laursen |
Dato : 26-09-08 10:51 |
|
Dennis Munding wrote:
> Hej Lisbet!
> "Lisbet Laursen" skrev:
>>> 1000 tak til både dig og Jørgen Farum Jensen, nu virker det!
>
> Det var så lidt...
>
>> Men et nyt spørgsmål dukker op: i IE7 er alle tooltips rigtigt
>> placeret - i nærheden af "trigger". Men i FF placerer det tredje
>> sig
>> ude til højre på siden?
>
> Fisk!?!
> Ikke genkendt - det ser rigtigt ud hos mig - FF3.0.1
Da jeg trykkede på opdater, kom den på plads!? Så nu skulle det være
i orden.
--
Med venlig hilsen
Lisbet
| |
Dennis Munding (26-09-2008)
| Kommentar Fra : Dennis Munding |
Dato : 26-09-08 12:20 |
|
Hej Lisbet!
"Lisbet Laursen" skrev:
> Dennis Munding wrote:
>> Fisk!?!
>> Ikke genkendt - det ser rigtigt ud hos mig - FF3.0.1
>
> Da jeg trykkede på opdater, kom den på plads!? Så nu skulle det være i
> orden.
En klassisk fejl, som jeg tror de fleste har prøvet...
Lyder godt at du fik det til at virke.
Med venlig hilsen
--
Dennis Munding
http://as-transport.dk/ -Sikker møbeltransport til tiden!
http://pe-vagtservice.dk/ -Når du vil passe på dine værdier!
http://munding-webdesign.dk/ -Vi ses! Ganske enkelt...
| |
Jørn Andersen (24-09-2008)
| Kommentar Fra : Jørn Andersen |
Dato : 24-09-08 21:29 |
| | |
Jørgen Farum Jensen (24-09-2008)
| Kommentar Fra : Jørgen Farum Jensen |
Dato : 24-09-08 22:27 |
| | |
|
|