Autor Zpráva
Garen
Profil *
Mám obrázek na kterém jsou rozdíly. Když kliknu na zadanou plochu na obrázku, potřebuju, aby se přes obrázek s rozdíly načetl obrázek s křížkem (jako že tam už bylo kliknuto). Jenže se mi zobrazí pouze obrázek s křížkem.


celé je to zde: http://cs-s.webovka.eu/test/test_imagemap.html.


a zdroják tady:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//CZ" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>poznej rozdily</title>
  </head>
  <body>
  <script type="text/javascript">
    function ok(x,y) {
      document.write ('<IMG STYLE="position: absolute; top: '+y+'px; left: '+x+'px;" SRC="./obrazky/rozdily/ok.png" BORDER="0">');
    };
    
    var s1="'295','300'";
    var s2="'250','297'";
    var s3="'185','330'";
    var s4="'205','364'";
    
    document.write ('<MAP NAME="map1">');
      document.write ('<AREA SHAPE="CIRCLE" COORDS="305,294,14" onclick="return ok('+s1+')">');
      document.write ('<AREA SHAPE="CIRCLE" COORDS="138,302,15" onclick="return ok('+s1+')">');
      document.write ('<AREA SHAPE="RECT" COORDS="235,283,261,311" onclick="return ok('+s2+')">');
      document.write ('<AREA SHAPE="RECT" COORDS="72,295,96,322" onclick="return ok('+s2+')">');
      document.write ('<AREA SHAPE="CIRCLE" COORDS="190,334,14" onclick="return ok('+s3+')">');
      document.write ('<AREA SHAPE="CIRCLE" COORDS="28,344,14" onclick="return ok('+s3+')">');
      document.write ('<AREA SHAPE="CIRCLE" COORDS="205,364,16" onclick="return ok('+s4+')">');
      document.write ('<AREA SHAPE="CIRCLE" COORDS="43,371,13" onclick="return ok('+s4+')">');
    document.write ('</MAP>');
    
    document.write ('<IMG SRC="./obrazky/rozdily/najdi_rozdily.gif" USEMAP="#map1" BORDER="0">');
  </script>
  </body>
</html>
_es
Profil
Ak sa document.write vyvolá až po načítaní dokumentu, tak ho uzavrie a otvorí nový, do ktorého začne zapisovať od začiatku. Asi to aj zároveň aj zruší celý script, keďže v tom novom by žiadny script nemal byť - bude začínať <IMG ... .
Garen
Profil *
No a právě nevim jak to udelat aby zustal puvodni obsah a jenom se "přidal" obrázek s křížkem. Někde jsem se s tím už setkal, ale pořád nevim čím to je. ??? (navíc js az tolik nerozumim)
Garen
Profil *
jinak zkoušel jsem i verzi která by měla v js jenom funkci a potom by se zbytek nevypysoval pomoci document.write, ale jen v html. Výsledek je ale totožný!
_es
Profil
Garen
Výsledek je ale totožný!

Samozrejme že to je totožné, celý obsah dokumetnu sa najprv vymaže a potom sa do čistého dokumentu zapíše parameter document.write.
Musíš to spraviť tak, že bude obrázok najprv neviditeľný, alebo niečím prekrytý a potom mu nastavíš pozíciu a zviditeľníš ho.
Garen
Profil *
joo super díky mam to vyřešené ;D

zde je výsledek:
(http://cs-s.webovka.eu/test/test_imagemap.html)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//CZ" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>poznej rozdily</title>
  </head>
  <body>
    <MAP NAME="map1">
      <AREA SHAPE="CIRCLE" COORDS="305,294,14" onclick='document.getElementById("r1").style.visibility = "visible"'>
      <AREA SHAPE="CIRCLE" COORDS="138,302,15" onclick='document.getElementById("r1").style.visibility = "visible"'>
      <AREA SHAPE="RECT" COORDS="235,283,261,311" onclick='document.getElementById("r2").style.visibility = "visible"'>
      <AREA SHAPE="RECT" COORDS="72,295,96,322" onclick='document.getElementById("r2").style.visibility = "visible"'>
      <AREA SHAPE="CIRCLE" COORDS="190,334,14" onclick='document.getElementById("r3").style.visibility = "visible"'>
      <AREA SHAPE="CIRCLE" COORDS="28,344,14" onclick='document.getElementById("r3").style.visibility = "visible"'>
      <AREA SHAPE="CIRCLE" COORDS="205,364,16" onclick='document.getElementById("r4").style.visibility = "visible"'>
      <AREA SHAPE="CIRCLE" COORDS="43,371,13" onclick='document.getElementById("r4").style.visibility = "visible"'>
      <AREA SHAPE="POLY" COORDS="175,230,172,219,184,198,206,179,240,181,263,198,263,212,253,216,225,201,218,207,209,204,190,226,180,230" onclick='document.getElementById("r5").style.visibility = "visible"'>
      <AREA SHAPE="POLY" COORDS="18,234,33,194,65,187,92,216,84,225,58,210,20,241" onclick='document.getElementById("r5").style.visibility = "visible"'>
    </MAP>
    <IMG SRC="./obrazky/rozdily/najdi_rozdily.gif" USEMAP="#map1" BORDER="0">
    <IMG id="r1" STYLE="visibility: hidden; position: absolute; top: 300px; left: 295px;" SRC="./obrazky/rozdily/ok.png" BORDER="0">
    <IMG id="r2" STYLE="visibility: hidden; position: absolute; top: 297px; left: 250px;" SRC="./obrazky/rozdily/ok.png" BORDER="0">
    <IMG id="r3" STYLE="visibility: hidden; position: absolute; top: 330px; left: 185px;" SRC="./obrazky/rozdily/ok.png" BORDER="0">
    <IMG id="r4" STYLE="visibility: hidden; position: absolute; top: 364px; left: 205px;" SRC="./obrazky/rozdily/ok.png" BORDER="0">
    <IMG id="r5" STYLE="visibility: hidden; position: absolute; top: 192px; left: 215px;" SRC="./obrazky/rozdily/ok.png" BORDER="0">
  </body>
</html>

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: