FancyZoom in HP einbinden

  • Ich bin neu hier und hatte mit HTML noch nicht all zu viel zu tun was sich jetzt wohl als Nachteil herausstellt. Aber man lernt ja nie aus.
    Bisher habe ich Websiten nur über Designe-Software erstellt. Nur das im voraus damit ihr mich versteht.

    Nun zur Frage:
    Ich arbeite mit der Software WebPageX4 und würde gern Bilder mit FancyZoom vergrößern.
    Hier die Seite: Der Typ VII
    Beschreibung zum Einbinden: cabel.name: FancyZoom 1.1
    Es ist nun nicht so das ich mit der Beschreibung zum einbinden nichts anfangen kann aber der html-Code von meiner Seite hat so gar nichts mit den zu tun die als Beispiel angeboten werden.
    Ich habe die beiden Ordner von FZ in meinen Root auf den Server geladen und dann versucht die beiden Script-Schnippsel

    <script src="/js-global/FancyZoom.js" type="text/javascript"></script>
    <script src="/js-global/FancyZoomHTML.js" type="text/javascript"></script>

    an die Richtige Stelle zu setzten.
    Mit dieser Beschreibung:

    Add onload="setupZoom()" inside your page's existing <body> tag. For example:

    <body id="whatever" [...] onload="setupZoom()">

    kann ich aber gar nichts anfangen. Da fehlen mir wohl doch die Kenntnisse.
    Wenn es nicht zu viel Arbeit macht würde ich mal den Html-Code der betreffenden Seite, wie er in meinem Programm angeboten wird hier mit einstellen und vieleicht kann man die Stellen Markieren wie es richtig sein müsste.

    Ich bedanke mich schon mal und hoffe auf Hilfe.

  • womit schreibst du deinen code?
    das is ja grausig

    und dein konstrukt hier:

    HTML
    <body text="#000000" style="background-color:#cccccc;background-image:url(wpimages/wpde26cb3e.png);background-repeat:no-repeat;background-position:top center;background-attachment:fixed; text-align:center; height:900px; /*Master Page Body Style*/ /*Page Body Style*/" __AddCode="MasterPageInBodyTag" __AddCode="PageInBodyTag">
    
    
    <<body id="whatever" onload="setupZoom()">

    is totaler humbug, beschäftige dich bitte mit den grundlagen von html..
    mach das hier

    HTML
    <<body id="whatever" onload="setupZoom()">

    ganz weg

    und das hier

    HTML
    <body text="#000000" style="background-color:#cccccc;background-image:url(wpimages/wpde26cb3e.png);background-repeat:no-repeat;background-position:top center;background-attachment:fixed; text-align:center; height:900px; /*Master Page Body Style*/ /*Page Body Style*/" __AddCode="MasterPageInBodyTag" __AddCode="PageInBodyTag">

    machste zu:

    HTML
    <body text="#000000"  style="background-color:#cccccc;background-image:url(wpimages/wpde26cb3e.png);background-repeat:no-repeat;background-position:top  center;background-attachment:fixed; text-align:center; height:900px;  /*Master Page Body Style*/ /*Page Body Style*/"  __AddCode="MasterPageInBodyTag" __AddCode="PageInBodyTag"   onload="setupZoom()">


    wobei du deinen gesamten code erstma aufräumen soltest..
    css auslagern in ne eigene datei und so..

  • Hallo Synaptic,

    danke für die Antwort.
    Du hast völlig Recht ich bin kein HTML-er und streue Asche auf mein Haupt.
    Besserung ist ja in Sicht.

    Wenn ich das richtig sehe sind also die ersten beiden Code-Schnippsel richtig gesetzt?!
    Das andere versuch ich zu realisieren. Wie gesagt der Html-Code wird duch das Programm erzeugt, deshalb sah es ja selbst für mich Laien komisch aus.
    Ich versuch erst einmal.

    Wenn du noch eine Frage erlaubst.

    Der Verweis:

    <a href="image.jpg"> <img src="image-thumbnail.jpg" /> </ a>

    bezieht sich ja auf das zu vergrößernde Bild.
    Muss ich beide *.jpg Benennen (ich nehme an das erste soll das
    große Bild sein) oder nur das erste so wie es auf dem Server liegt.

    Danke

  • naja du kannst natürlich auch jedes andere bild da einsetzen..
    dukannst ja auch ein gif als vorschaubild haben und auf ein jpg verlinken, das sollte der fancybox egal sein.

    und ich rate dir dringenst den gesamten code zu überarbeiten, da sind noch sehr sehr viele fehler drin, aber mit etwas arbeit und gesundem selbstvertrauen wirste das schon hinbekommen :)

  • also das sinnvollste ist, wenn du mit nem normalen editor arbeitest, der haut dir keinen sinnlosen code in deine dokumente, die blähen die nur unnötig auf...
    aber wenn du fragen/probleme hast, scheue dich nicht nachzufragen, dann kann dir hier geholfen werden ;)

  • So da bin ich noch einmal.
    ich habe den Seiten-html-Code noch nicht umgebaut, da ich erst einmal
    das Script zum Laufen bringen möchte.
    Ich habe nach Vorlage von Synaptic den Code so eingebunden aber es tut sich nichts. Das Bild wird immer noch nicht gezoomt.
    Ich poste noch einmal die drei stellen in denen ich die Code-Schnippsel eingefügt habe.
    Kann da bitte noch einmal jemand drüber schauen.

    Ich danke euch.

    Code
    <body text="#000000" style="background-color:#cccccc;background-image:url(wpimages/wpde26cb3e.png);background-repeat:no-repeat;background-position:top center;background-attachment:fixed; text-align:center; height:900px;" __AddCode="PageInBodyTag"  onload="setupZoom()">

    Die Bildverlinkung:

    Code
    <div style="position:absolute; left:300px; top:669px; width:400px; height:151px;">
        <!--BeforeObject-->
        <a title="Boot VII" href="[URL='http://www.forum-hilfe.de/view-source:http://www.u-boot-typ-vii.de/Neu/Grundriss%20VII.jpg']Grundriss VII.jpg[/URL]">
        <img src="[URL='http://www.forum-hilfe.de/view-source:http://www.u-boot-typ-vii.de/Neu/wpimages/wp9b592112.jpg']wpimages/wp9b592112.jpg[/URL]" width="400" height="151" border="0" id="pic_9" name="pic_9" title="" alt="" __AddCode="here" ></div>
    </div>
    </body>
    </html>
  • auf anhieb fällt mir auf du hast hier nen fehler:

    HTML
    <div style="position:absolute; left:300px; top:669px; width:400px; height:151px;">
        <!--BeforeObject-->
        <a title="Boot VII" href="Grundriss VII.jpg">
        <img src="wpimages/wp9b592112.jpg" width="400" height="151" border="0" id="pic_9" name="pic_9" title="" alt="" __AddCode="here" ></div>
    </div>
    </body>
    </html>

    du öffnest nen link und probierst ihn mit nem div zu schliessen...
    wie ich bereits gesagt hatte, es ist sinnvoller, wenn du dich mehr mit der materie befasst und nen editor nutzt statt ne software, die das für dich erledigen soll..