Javascript - koristenje slike umjesto gumbica

[Ivor]

Tenutno ovako izgleda i sve radi...

head

function calc1(form) {
a = form.a.value*form.b.value;
c=form.c.value*form.b.value;
u=a-c;
form.total3.value = u;
}

body

<form name="form1">
<table border=0 cellpadding=4 cellspacing=1>
<tr>
<td width="310" height="219" align=center><p>
    <input type="text" name="a" size=5>
  </p>
  <p>
       
    <input type="text" name="b" size=5>
    </p>
  <p>
    <input type="text" name="c" size=5>
  </p>
  <p>
   <input type="button" value="Izračunaj"
onclick="calc1(this.form)" />
    </p>
  <p>
  <input type="text" name="total3"
size=5 maxlength=40 />
  kn</p></td>
</tr>
</table>
</form>

Umjesto gumbica sam ubacio dolje navedeni kod i kad pristisnem na sliku u firefoxu mi na tren izbaci rezultat i obrise sve brojeve koje sam uneso.

<input type="image" src="button.gif" onclick="javascript:calc1(this.form)" />

Pokusao sam razne kombinacije ali mi nije uspjelo proradit. Ima tko kakvu ideju?

[mbozick1]

Probaj ovako.

head:

<script type="text/javascript">
function calc1(form) {
a = form.a.value*form.b.value;
c=form.c.value*form.b.value;
u=a-c;
form.total3.value = u;
}
</script>

<style type="text/css">
button {padding:0;}
</style>

body:

<form name="form1">
<table border=0 cellpadding=4 cellspacing=1>
<tr>
<td width="310" height="219" align=center><p>
    <input type="text" name="a" size=5>
  </p>
  <p>
       
    <input type="text" name="b" size=5>
    </p>
  <p>
    <input type="text" name="c" size=5>
  </p>

  <p><button type="button" onclick="javascript:calc1(this.form)">
<img src="button.gif">
</button> </div>

    </p>
  <p>
  <input type="text" name="total3"
size=5 maxlength=40 />
  kn</p></td>
</tr>
</table>

[Ivor]

Hvala, radi...

Samo... slika gumbica je nesto manja od "pravog" pa se vidi u pozadini, posto sam kod prepravio u notepadu neznam da li se moze "pravom" gumbu smanjit dimanzija

Pozabavit cu se s time kad budem za kompom.

Imas pivu kad dodes u Zagreb

[mbozick1]

Autor Ivor

Hvala, radi...

Samo... slika gumbica je nesto manja od "pravog" pa se vidi u pozadini, posto sam kod prepravio u notepadu neznam da li se moze "pravom" gumbu smanjit dimanzija

Pozabavit cu se s time kad budem za kompom.

Imas pivu kad dodes u Zagreb

Zato sam ti napisao da u head css rule da button nema padding...
Evo, ja sam probao tocno kako sam ti napisao i meni se vidi samo button.gif (ne vidi se orginalni gumb iza)

Ok, na pivu racunam

[mbozick1]

Aha, skuzih sada da u firefox-u ne prikazuje isto kao u chromeu ali nema veze, dodaj u css za button jos

border:0;
background:none;

i to bi trebalo onda biti to

[Ivor]

Isprobano s IE i FF, radi odlicno.

Jos jednom hvala

p.s. vec je postavljeno na webu

[Ivor]

Trebao bih jos jedan dodatak programu.

Problem nastaje kada se za decimalni zarez koristi, zarez (npr. 1,2) u rezultatu ispise NaN

Kada je decimalni zarez, tocka sve super radi.

Posto neznam bas programirat, trebala bi mi linija koda koja ce zarez, zamjenit tockom

[dal3boy]

Pa napravi samo da ti pregleda value iz forme i replace "," s "." i to je to

ovako nekako
function calc1(form) {
a = form.a.value.replace(",",".")*form.b.value.replace(",",".");
c=form.c.value.replace(",",".")*form.b.value.replace(",",".");
u=a-c;
form.total3.value = u;
}

ovo mi prvo pada na pamet....

[Ivor]

Radi, hvala