/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Mouseover ved <input ..>
Fra : Martin Møller Bæk


Dato : 10-03-03 21:45

Hej

Kan man ikke putte mouseover på en submit knap,
hvis man har brugt et billede. Dvs ved:
<input type="image" src="img3-up.gif" name="image3" />

Jeg laver mouseover ved:

isamap = new Object();
isamap[0] = "_up"
isamap[1] = "_mo"

if (document.images)
{
isimages = new Object();
isimages.image3_up = new Image();
isimages.image3_up.src = "img3-up.gif";
isimages.image3_mo = new Image();
isimages.image3_mo.src = "img3-mo";
....
}

function isimgact(id, act)
{
if(document.images)
document.images[id].src = eval("isimages." + id +
isamap[act] + ".src");
}

Det virker fint ved billeder, men hvis jeg bruger
en billede som submit i en form kan jeg ikke få det
til at virke. Jeg gør følgende:

<input type="image" src="img3-up.gif" name="image3"
OnMouseOver="isimgact('image3',1)"
OnMouseOut="isimgact('image3',0)"
OnMouseDown="isimgact('image3',1)" />

Hvad gør jeg galt (eller er det bare ikke muligt)?

Mvh
Martin MB


 
 
Lasse Reichstein Nie~ (10-03-2003)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 10-03-03 22:01

Martin Møller Bæk <martin@nospam.aflame.dk> writes:

> Kan man ikke putte mouseover på en submit knap,
> hvis man har brugt et billede. Dvs ved:
> <input type="image" src="img3-up.gif" name="image3" />
....
> document.images[id].src = eval("isimages." + id +
....
> Det virker fint ved billeder, men hvis jeg bruger
> en billede som submit i en form kan jeg ikke få det
> til at virke.

En <input type="image" ...> er ikke det samme som <img>, og
du kan ikke få fat i den med document.images. Du kan
enten bruge
document.forms['formnavn'].elements['image3']
til at få fat i input-elementet, eller du kan lave det om
til en <button>. Det er noget i stil med:

<button type="submit"><img src="..." id="image3"
style="vertical-align:button"></button>

Button-tagget er den nye og forbedrede knap, hvor man kan putte
næsten hvad som helst på den.

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'

Lasse Reichstein Nie~ (10-03-2003)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 10-03-03 22:06

Lasse Reichstein Nielsen <lrn@hotpop.com> writes:

> <button type="submit"><img src="..." id="image3"
> style="vertical-align:button"></button>

Pah. Det skulle selvfølgelig være "vertical-align:bottom".

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'

Martin Møller Bæk (10-03-2003)
Kommentar
Fra : Martin Møller Bæk


Dato : 10-03-03 22:36

Lasse Reichstein Nielsen wrote:
> En <input type="image" ...> er ikke det samme som <img>, og
> du kan ikke få fat i den med document.images. Du kan
> enten bruge
> document.forms['formnavn'].elements['image3']
> til at få fat i input-elementet, eller du kan lave det om
> til en <button>. Det er noget i stil med:
>
> <button type="submit"><img src="..." id="image3"
> style="vertical-align:button"></button>

Tak for det. Jeg har prøvet begge dele med blandet succes.
Ved førstnævnte bruge jeg følgende funktion

function isimgact2(id, act, formname)
{
if(document.images)
document.forms[formname].elements[id] =
eval("isimages." + id + isamap[act] + ".src");
}

Er det rigtig lavet eller?
Det virkede ikke, men lavede heller ikke fejl.

Med button har jeg fået det til at virke, men
der er ret meget "luft" på knappen. Kan man
ikke fjerne dette helt?
Jeg har sat padding, margin samt border-size
til 0 på knappen, men der er stadig luft.

Mvh
Martin MB


Lasse Reichstein Nie~ (10-03-2003)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 10-03-03 22:57

Martin Møller Bæk <martin@nospam.aflame.dk> writes:

> Tak for det. Jeg har prøvet begge dele med blandet succes.
> Ved førstnævnte bruge jeg følgende funktion
>
> function isimgact2(id, act, formname)
> {
> if(document.images)
> document.forms[formname].elements[id] =
> eval("isimages." + id + isamap[act] + ".src");
> }
>
> Er det rigtig lavet eller?

Det tror jeg ikke. Der mangler mindst et ".src" efter "elements[id]".

En generel regel: Hvis du bruger "eval", så er det ikke den nemmeste
måde at gøre det på. Jeg har stadig ikke set en brug af eval i en
almindelig webside, der ikke kunne gøres lige så godt uden.
Måske følgende virker:

function isimgact2(id, act, formname)
{
var elem=document.forms[formname].elements[id];
elem.src=isimages[id+isamap[act]].src;
}

Det virker selvfølgelig kun hvis "id" er navnet på et input-element,
og ikke på almindelige billeder. Jeg regner med at det er ok.

> Det virkede ikke men lavede heller ikke fejl.

Jeg havde regnet med en advarsel eller exception. Du forsøger
at overskrive selve input-elementet i formens elements-array.
Det er sandsynligvis read-only.

> Med button har jeg fået det til at virke, men der er ret meget
> "luft" på knappen. Kan man ikke fjerne dette helt?
> Jeg har sat padding, margin samt border-size til 0 på knappen, men
> der er stadig luft.

Prøv "vertical-align:bottom" i stedet for det fumle jeg skrev, det
skulle fjerne noget af luften under billedet. Resten skulle (7-9-13)
kunne fjernes med padding og margin, men det afhænger også af hvordan
browseren vælger at vise et button-element. Der er ikke nogen standard
for det, den forventes at tilpasse udseendet til det brugerinterface
browseren kører på.

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'
ARTICLE 24427
LIST ACTIVE daimi.misc
LIST ACTIVE dk.edb.programmering.java
LIST ACTIVE dk.kultur.mad+drikke
LIST ACTIVE dk.edb.tekst
LIST ACTIVE opera.skandinavisk
LIST ACTIVE opera.plugins
LIST ACTIVE dk.binaer.erotik.film
LIST ACTIVE alt.binaries.games.adult
LIST ACTIVE alt.binaries.games.int.fiction
LIST ACTIVE rec.games.int-fiction
LIST ACTIVE rec.arts.int-fiction
LIST ACTIVE dk.edb.sikkerhed.virus
LIST ACTIVE dk.admin.netmisbrug
LIST ACTIVE dk.edb.internet.webdesign.clientside
LIST ACTIVE dk.marked.privat.edb
LIST ACTIVE dk.videnskab.psykologi
LIST ACTIVE dk.edb.internet.webdesign.html
LIST ACTIVE dk.edb.netvaerk
LIST ACTIVE alt.atheism.moderated
LIST ACTIVE dk.edb.internet.webdesign
LIST ACTIVE dk.edb.system
LIST ACTIVE rec.games.frp.dnd
LIST ACTIVE dk.videnskab
LIST ACTIVE dk.spil.andre-emner
LIST ACTIVE dk.edb.sikkerhed
LIST ACTIVE dk.edb.internet.udbydere.webhotel
LIST ACTIVE dk.kultur.sprog
LIST ACTIVE tele.internet.news-service
LIST ACTIVE dk.forbruger
LIST ACTIVE dk.admin.netikette
LIST ACTIVE dk.marked.privat.bolig
LIST ACTIVE dk.kultur.sciencefiction
LIST ACTIVE dk.videnskab.jura
LIST ACTIVE dk.admin
LIST ACTIVE dk.edb.grafik
LIST ACTIVE dk.binaer
LIST ACTIVE dk.fritid.rollespil
LIST ACTIVE rec.games.rpg.dnd
LIST ACTIVE opera.general
LIST ACTIVE comp.lang.javascript
LIST ACTIVE opera.test
LIST ACTIVE microsoft.public.windowsxp.general
LIST ACTIVE opera.wishlist
LIST ACTIVE opera.beta
LIST ACTIVE opera.announce
LIST ACTIVE dk.edb.internet.udbydere
LIST ACTIVE alt.games.mame
LIST ACTIVE opera.tech

Martin Møller Bæk (10-03-2003)
Kommentar
Fra : Martin Møller Bæk


Dato : 10-03-03 23:30

Lasse Reichstein Nielsen wrote:
> Måske følgende virker:
>
> function isimgact2(id, act, formname)
> {
> var elem=document.forms[formname].elements[id];
> elem.src=isimages[id+isamap[act]].src;
> }

Det gjorde det desværre ikke.

> Det virker selvfølgelig kun hvis "id" er navnet på et input-element,
> og ikke på almindelige billeder. Jeg regner med at det er ok.

Det er navnet på et inputelement

> Prøv "vertical-align:bottom" i stedet for det fumle jeg skrev, det
> skulle fjerne noget af luften under billedet. Resten skulle (7-9-13)
> kunne fjernes med padding og margin, men det afhænger også af hvordan
> browseren vælger at vise et button-element. Der er ikke nogen standard
> for det, den forventes at tilpasse udseendet til det brugerinterface
> browseren kører på.

Ok tak. Jeg tror bare, jeg bruger en <button>.
Jeg har sat baggrundsfarven på denne til baggrundsfarven,
bag knappen. Så er det kun billedet, der er synligt.

Men tak for hjælpen.

Mvh
Martin MB


Søg
Reklame
Statistik
Spørgsmål : 177506
Tips : 31968
Nyheder : 719565
Indlæg : 6408561
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste