Thomas: mehrere Links in einer Grafik aber mit Prozentabgaben

Hi...
ich hab zwar in Self-HTML gefunden, wie ich mehrere Links in einer Grafik mache (klappt auch recht gut), aber das Problem ist, wenn ich die pixelweise für z.B. eine Auflösung von 1024x768 mache und jemand hat 800x600 als Auflösung, dann passt das nicht mehr..
Ich hab schon versucht das mit Prozentangaben zu machen, aber irgendwie nimmt der Explorerdas nicht..oder ich mach was falsch.

Schon mal Danke für Eure Hilfe

Thomas

  1. Grafik => mehrere Hyperlinks ?

    Zerschnitten oder mit area href?

    Bei letzterem wirds lustig! ;-)

    Gruß

    1. Grafik => mehrere Hyperlinks ?

      Zerschnitten oder mit area href?

      Bei letzterem wirds lustig! ;-)

      Gruß

      mit area href *g*
      Irgendwie war mir das klar dass ich mir da wieder was Schwieriges rausgesucht habe...
      Kann mir da einer helfen?
      Alos die Grafik NICHT zerschneiden

      Gruß

      Thomas

      1. mit area href *g*
        Irgendwie war mir das klar dass ich mir da wieder was Schwieriges rausgesucht habe...
        Kann mir da einer helfen?
        Alos die Grafik NICHT zerschneiden

        AUTSCH

        Da kann ich nur sagen viel Spaß, denn bei diesem Fall, muss man eine Monsterfunktion schreiben! BEDENKE!!! Area href gibt seine hübschen Bestandteile in PIXEL an! Zur leichten Demonstration habe ich Dir ein Mail geschickt, zur Veranschaulichung von einer "kleinen" Map!

        Aber zurück zum thema wenn(die Betonung liegt auf diesem Wort) du nicht solche hübschen Area hrefs erzeugt hast wie du sie in meinem Mail bewundern kannst, dann hast du eine realistische Chance, das ganze durch Javascript zu verändern, sprich es sollten schöne vielleicht geometrische Figuren sein (Area hrefs)!

        Schick mir vielleicht die Seite dann gibts eine Instantlösung.
        Ansonsten bitte nähere Beschreibung.

        Bis dann

        Christoph

        1. hmm Hab die Mail irgendwie nicht bekommen..
          aber du kannst mal unter

          http://www.cybercosmos.net/winfotest/index.html

          gucken. So wie der Link auf der 1 ist.. nur halt mit Prozent, damits auch für andere Auflösungen klappt.

          Gruss & thx

          Thomas

          1. Hi
            hat zwar gedauert bis ich es mal gedanklich erfasst habe, aber das scheint die Lösung deines Problems zu sein.

            Ich würde allerdings ein größeres Bild empfehlen

            am besten JPG mit progressivem Encoding und 25%Komprimierung!!!

            Aber nun zum wesentlichen Teil =>

            <script language="JavaScript" type="text/javascript">
            <!--
            //Wichtig das muss im Bodytag and der gewünschten position stehen!!!!!
            var img = '';
            var x = screen.width;
            var y = screen.height;
            // Standardauflösung
            var ax = 1024;
            var ay = 768;
            var pzx = x/ax;
            var pzy = y/ay;
            if (pzx != pzy) {
            pzy = pzx;
            }
            //Leider gibt es auch Auflösungen die nicht das Verhältnis 4:3 haben (kenne aber niemand der so eine benützt)
            //Die bekommen hierdurch eine "gestauchte" Version, da ich in der for schleife nicht darauf Rücksicht nehme
            function scale(coords) {
             var scaledcoords = '';
             var xcoords = coords.split(',');
             for (var i=0; i < xcoords.length; i++) {
              scaledcoords += xcoords[i]*pzx + ',';
             }
             return scaledcoords;
            }
            // Das Bild mit Map in die Variable img schreiben
            img = '<img alt="TEST" src="thommy-Dateien/index.gif" align="absMiddle" useMap="#Semester" border="0" width="';
            img += (600*pzx); //Bildbreite anpassen
            img += '" height="';
            img += (490*pzy); //Bildhöhe anpassen
            img += '" /><map name="Semester">';
            //hier die shapes einfügen laut muster!!! sonst geht da nix!!!
            //zuerst den shape tag wie folgt
            img += '<area shape="POLY" alt="1.Semester" coords="';
            //dann scale('KOORDINATEN'); Kannst du gleich so wie sie sind kopieren!!!
            img += scale('57,370,153,343,189,412,120,480,39,450');
            //dann den Hyperlink schreiben
            img += '" href="http://www.cybercosmos.net/winfotest/1.Semester/index.html" />';
            //und die map schließen
            img += '</map>';
            //Bild ausgeben
            document.write(img);
            -->
            </script>

            Viel spaß damit

            Gruß Christoph

            1. Funktioniert einwandfrei. Echt gut! Danke!
              (Hät ich mir ja denken können, dass man da wieder rumtricksen muss... wär ich wahrscheinlich nie drauf gekommen!)

              Achja..wo wir gerade dabei sind: Was meinst du mit "progressivem Encoding"? Sagt mir nichts.

              Thomas

              1. Funktioniert einwandfrei. Echt gut! Danke!
                (Hät ich mir ja denken können, dass man da wieder rumtricksen muss... wär ich wahrscheinlich nie drauf gekommen!)

                Nicht so bescheiden, mit der Zeit kommt das schon

                UND

                Danke!

                Achja..wo wir gerade dabei sind: Was meinst du mit "progressivem Encoding"? Sagt mir nichts.

                Wenn du ein JPG abspeicherst, dann hast du die Option die Datei mit normalen oder progressive Encoding abzuspeichern. Einfach mal beim abspeichern NICHT voreilig auf OK drücken sondern bei Optionen oder Einstellungen nachschauen. Gute Programme unterstützen dies.

                Noch mal Danke und ich hoffe ich konnte Dir helfen Gruß

                Christoph

                1. Jap hast du.. sowas hat mein Programm nicht..aber gut..habs notiert.

                  Werd jetzt mal weiterbasteln...
                  Und nochmal: DANKE!

                  Thomas

  2. hi

    ich hab zwar in Self-HTML gefunden, wie ich mehrere Links in einer Grafik mache (klappt auch recht gut), aber das Problem ist, wenn ich die pixelweise für z.B. eine Auflösung von 1024x768 mache und jemand hat 800x600 als Auflösung, dann passt das nicht mehr..

    du meinst skalierbare Imagemap? Das klappt imho nur, wenn die einzelnen Teile eigenständige Grafiken sind. Und dann kommt noch das Problem, dass die üblichen Web-Formate ja Pixel-Orientiert sind und daher nur begrenzt angehnlich bleiben beim Skalieren. Ich würde die Bereiche zwischen dem Grafiken skalieren oder über Tiles ausfüllen..

    gruss Kai

    1. Hi

      du meinst skalierbare Imagemap? Das klappt imho nur, wenn die einzelnen Teile eigenständige Grafiken sind. Und dann kommt noch das Problem, dass die üblichen Web-Formate ja Pixel-Orientiert sind und daher nur begrenzt angehnlich bleiben beim Skalieren. Ich würde die Bereiche zwischen dem Grafiken skalieren oder über Tiles ausfüllen..

      da sag ich nur LOL (nicht sarkastisch gemeint)

      habe mir das mal angekuckt

      und das mittelmäßige Ergebnis findet man im Vorletzten posting von mir zu diesem Beitrag.

      hoffe ich habe eine brauchbare Lösung dieses Problems fabriziert.
      bis dann UND

      Gruß Christoph