Antworten auf deine Fragen:
Neues Thema erstellen

Was mache ich falsch???

V

Vince999

Guest

Hallo liebe Gemeinde. Ich bin neu hier, habe kein richtiges Thema gefunden, da mein Problem noch nicht gelöst wurde, zumindest war es schwer, danach zu suchen. Sollte es schon existieren, dann bitte ich um Entschulding und hoffe, es kann verschoben werden.

Es geht um das liebe Theme Lightbox.

Ich möchte gerne meine Alben, auf meine mit iWeb erstellte Seite bringen. Die Präsentation soll über eine Lightbox erfolgen, da mir das übliche von iWeb nicht zusagt.

Zunächst einmal meine Homepage, zu finden unter http://www.normanbackhaus.de diese ist die aktuelle, aber mittlerweile will ich ein wenig mehr, was Design betrifft. Daher habe ich mir eine Testpage gebastelt. . Das lange Laden der Grfik liegt erstmal daran, dass die Hintergrundgrafiken noch knapp 12MB groß sind, da ich noch experimentiere. Wenn es fertig ist, werden die Grafiken durch jpeg ersetzt.

Die Seite "Meine Alben" soll so eine Art Inhaltsangabe sein.

Die Seite "Links" enthalt momentan zwei Bilder. So etwa soll es aussehen, und per Klick auf ein Bild soll die Lightbox geöffnet werden. Die Bilder sollen alle als Gruppe präsentiert werden, also mit den Prev und Next Pfeilen.

Im "Gästebuch" ist ein Link, in dem zwar die Lightbox funktioniert, aber ich kann kein Bild direkt auswählen. Dies ist besonders blöd, wenn ich knapp 100 Fotos aus einem album bereitstelle. Diese Lightbox ist mit iFuWeb gemacht worden.

EDIT: Ich stelle grad fest, dass es über das Internet nicht funktioniert. Es sei aber gesagt, dass es offline, wenn ich die index.html Datei in Safari oder Firefox öffne, da klappt es.

Auf der Seite "Newsletter" ist eine Lightbox zu sehen, die mit einem Plugin aus iWeb erstellt wurde. Gefällt mir nicht, da der Hintergrund nicht transparent ist, und keine Farbe, direkt zum Hintergrundbild passt. Und mit Links arbeiten, die dann auf eine graue Seite linkt, möchte ich, sofern ich die Wahl habe auch nicht arbeiten. Zu sehen, wenn man den kleinen Link unterhalb des iFrame anklickt. Zudem werden Hochkantfotos nicht gut dargestellt, es sei denn ich würde den iFrame vergrößern, was aber auch wieder zur Folge hätte, dass der graue Hintergrund mitwächst.

Auf der Seite "Impressum" ist ein Link auf das erste Bild gesetzt, welches eine HTML Seite öffnet. Auf dieser Seite klappt die Lightbox so, wie ich es haben möchte.
Nur ich verstehe folgendes nicht. Das rechte Bild auf meiner Seite verlinkt zu und das Bild, da wo die Lightbox funktioniert verlinkt ebenfalls zu . Mal klappt es, mal nicht.

Hiernoch der Quellcode, von der Lightbox, wo es funktioniert.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
    
    <title>Lightbox JS v2.0 | Test Page</title>

    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
    
    <script src="js/prototype.js" type="text/javascript"></script>
    <script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
    <script src="js/lightbox.js" type="text/javascript"></script>

    <style type="text/css">
        body{ color: #333; font: 13px 'Lucida Grande', Verdana, sans-serif;    }
    </style>

</head>
<body>


<h1><a href="http://www.lokeshdhakar.com/projects/lightbox2/">Lightbox JS <em>v2.04</em></a></h1>
<p><a href="http://www.lokeshdhakar.com">by Lokesh Dhakar</a></p>

<h2>Example</h2>

<a href="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6323.jpg" rel="lightbox[NY]"><img src="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6323.jpg" width="134" height="200" alt="" /></a>
<a href="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6370.jpg" rel="lightbox[NY]"><img src="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6370.jpg" width="200" height="125" alt="" /></a>





</body>
</html>
Wie schaffe ich es, dass wenn ich auf ein Thumbnail auf der Seite "Links" klicke, dass sich dann die Lightbox für ein ganzes Album öffnet?

Ich hoffe, ich habe mein Problem unmissverständlich ausgedrückt. Ich bin nämlich absoluter Laie, was HTML, JAVASCRIPT etc. angeht. Deshalb muss es auch mit iWeb sein, ansonsten kann ich es nciht anders. Und hoffe, dass Antworten auch so einfach formuliert werden, dass ich sie auch verstehe und vorallem umsetzen kann.
biggrin.png


Viele Grüße und ein schönes Wochenende wünsche ich euch allen
 

cebito

undefined

AW: Was mache ich falsch???

Das von sokie beantwortet alle deine Fragen, Kostet allerdings 90 Punkte...

Edit: hab grad mal reingeschaut, du bindest alle Bilder normal ein und gibst allen Vorschaubildern bis auf das erste ein style="display:none" - so ist das erste Vorschaubild zu sehen und öffnet die komplette Galerie.....
 
Zuletzt bearbeitet:
V

Vince999

Guest

AW: Was mache ich falsch???

Das von sokie beantwortet alle deine Fragen, Kostet allerdings 90 Punkte...

Edit: hab grad mal reingeschaut, du bindest alle Bilder normal ein und gibst allen Vorschaubildern bis auf das erste ein style="display:none" - so ist das erste Vorschaubild zu sehen und öffnet die komplette Galerie.....

Hallo cebito,

erstmal Danke für deine Hilfe. Aber Tut konnte mir nicht weiter helfen, waren aus meiner Sicht 90Punkte verschenkt, denn da wurde alles gesagt, was ich irgendwie schonmal gelesen habe.

Zu deiner Ergänzung. Sei mir bitte nicht böse, aber ich habe absolut Null Ahnung von HTMl, CSS etc. Wo muss genau das style="display:none" hin?
 

cebito

undefined

AW: Was mache ich falsch???

Code:
<a href="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6323.jpg" rel="lightbox[NY]"><img src="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6323.jpg" width="134" height="200" alt="" /></a><!--erstes Bild sichtbar -->
<a href="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6370.jpg" rel="lightbox[NY]"><img src="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6370.jpg" width="200" height="125" alt="" style="display:none" /></a><!--unsichtbar ab dem zweiten... usw. -->
 
V

Vince999

Guest

AW: Was mache ich falsch???

Ich frage dich mal anders?! Kennst du dich mit iWeb aus?

Der Quellcode der Seite "Links" sieht folgender Maßen aus:
HTML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
  <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    
    <meta name="Generator" content="iWeb 2.0.4" />
    <meta name="iWeb-Build" content="local-build-20090404" />
    <meta name="viewport" content="width=1250" />
    <title>Links</title>
    <link rel="stylesheet" type="text/css" media="screen,print" href="Links_files/Links.css" />
    <!--[if IE]><link rel='stylesheet' type='text/css' media='screen,print' href='Links_files/LinksIE.css'/><![endif]-->
    <script type="text/javascript" src="Scripts/iWebSite.js"></script>
    <script type="text/javascript" src="Scripts/iWebImage.js"></script>
    <script type="text/javascript" src="Links_files/Links.js"></script>
  </head>
  <body style="background: #101010; margin: 0pt; " onload="onPageLoad();">
    <div style="text-align: center; ">
      <div style="margin-bottom: 10px; margin-left: auto; margin-right: auto; margin-top: 10px; overflow: hidden; position: relative; word-wrap: break-word;  text-align: left; width: 1250px; " id="body_content">
        <div style="background: transparent url(Links_files/backgroundimage_1.png) no-repeat scroll center center; width: 1250px; ">
          <div style="float: left; margin-left: 0px; position: relative; width: 1250px; z-index: 15; " id="nav_layer">
            <div style="height: 0px; line-height: 0px; " class="bumper">¬?</div>
            <div style="clear: both; height: 0px; line-height: 0px; " class="spacer">¬?</div>
          </div>
          <div style="height: 75px; margin-left: 0px; position: relative; width: 1250px; z-index: 5; " id="header_layer">
            <div style="height: 0px; line-height: 0px; " class="bumper">¬?</div>
          </div>
          <div style="margin-left: 0px; position: relative; width: 1250px; z-index: 10; " id="body_layer">
            <div style="height: 0px; line-height: 0px; " class="bumper">¬?</div>
            <div style="height: 188px; width: 300px;  height: 188px; left: 128px; position: absolute; top: 336px; width: 300px; z-index: 1; " class="tinyText style_SkipStroke stroke_0">
              <a href="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6370.jpg" title="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6370.jpg"><img src="Links_files/DSC_6370.jpg" alt="" style="border: none; height: 188px; width: 300px; " /></a>
            </div>
            


            <div style="height: 300px; width: 201px;  height: 300px; left: 524px; position: absolute; top: 280px; width: 201px; z-index: 1; " class="tinyText style_SkipStroke stroke_0">
              <a href="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6323.jpg" title="http://www.normanbackhaus.de/lightbox2.04/images/DSC_6323.jpg"><img src="Links_files/DSC_6323.jpg" alt="" style="border: none; height: 300px; width: 201px; " /></a>
            </div>
            


            <div id="id1" style="height: 22px; left: 570px; position: absolute; top: 95px; width: 629px; z-index: 1; " class="style_SkipStroke_1">
              <div class="text-content graphic_textbox_layout_style_default_External_629_22" style="padding: 0px; ">
                <div class="graphic_textbox_layout_style_default">
                  <p style="padding-bottom: 0pt; padding-top: 0pt; " class="paragraph_style">¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬?¬? <a class="class1" href="Meine_Alben.html" title="Meine_Alben.html">Meine Alben</a>¬?¬?¬?¬?¬?¬?¬? <span class="style">Links</span>¬?¬?¬?¬?¬?¬?¬? <a class="class2" href="Gaestebuch.html" title="Gaestebuch.html">G√§stebuch</a>¬?¬?¬?¬?¬?¬?¬? <a class="class3" href="Newsletter.html" title="Newsletter.html">Newsletter</a>¬?¬?¬?¬?¬?¬?¬? <a class="class4" href="Impressum.html" title="Impressum.html">Impressum</a>¬?¬?¬?¬?¬?¬?¬? <a class="class5" href="About_Me.html" title="About_Me.html">About Me</a></p>
                </div>
              </div>
            </div>
            <div style="height: 1125px; line-height: 1125px; " class="spacer">¬?</div>
          </div>
          <div style="height: 1px; line-height: 0px; margin-left: 0px; position: relative; width: 1250px; z-index: 0; " id="footer_layer">
            <div style="height: 0px; line-height: 0px; " class="bumper">¬?</div>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>
Dieser ist von iWeb erstellt, ohne, dass ich etwas per Hand vorgenommen habe. Kannst du mit dem Code was anfangen?

Der Code, den du mir gegeben hattest, der macht ja genau das Gegenteil, was ich erreichen möchte. Ich möchte ja grad für jedes Bild ein eigenes Thumbnail, dass frei angeklickt werden kann.

Als Beispiel. Ich möchte auf einer Seite die Bilder image1.jpg,...,image20.jpg präsentieren. Ich erstelle also 20 kleine Thumbnail. Was muss gemacht werden, dass ich auf das Bild image12.jpg klicke, und dieses wird per Lightbox geöffnet, und ich kann per Prev oder Next Pfeil zu image11.jpg oder image13.jpg wechseln?

Ja, ich weiß, ich stelle mich total doof an. :(
 

cebito

undefined

AW: Was mache ich falsch???

Dann mach es doch so wie auf deiner Impressum-Beispielseite... versteh jetzt auch dein Problem nicht mehr, denn da funzt es doch...
 
V

Vince999

Guest

AW: Was mache ich falsch???

Dann mach es doch so wie auf deiner Impressum-Beispielseite... versteh jetzt auch dein Problem nicht mehr, denn da funzt es doch...
Da funktioniert es doch nicht. Ist das Problem so missverständlich geschrieben? :uhm:

Gut, bleiben wir bei der Impressum Seite. Das linke Foto verlinkt auf eine neue weiße Seite. Das ist nicht schön, da ich gerne eine Lightbox in der Seite haben möchte, in der auch die Thumbnails sind. Aber bei der weißen Seite (), da habe ich ja die Lightbox zum Laufen bekommen. Das rechte Foto auf der Impressumseite dagegen hat keine Lightbox, da wird lediglich das Foto geladen.

Ich gebe es auf! :'(

Gute Nacht
 

leohh

CSS verliebt

AW: Was mache ich falsch???

Du hast schon gelesen oder?!
Part 2 - Activate
  1. Add a rel="lightbox" attribute to any link tag to activate the lightbox. For example:
    HTML:
    <a href="http://www.psd-tutorials.de/modules/Forum/images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
    Optional: Use the title attribute if you want to show a caption.

  2. If you have a set of related images that you would like to group, follow step one but additionally include a group name between square brackets in the rel attribute. For example:
    HTML:
    <a href="http://www.psd-tutorials.de/modules/Forum/images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
    <a href="http://www.psd-tutorials.de/modules/Forum/images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
    <a href="http://www.psd-tutorials.de/modules/Forum/images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
    No limits to the number of image sets per page or how many images are allowed in each set. Go nuts!
Ich seh da nix von in deinem Quellkot ~> ergo kann das auch nicht gehen.
Wieso machst du das eigentlich nicht so wie du es beim Gaestebuch gemacht hast?!

Sorry, wegen der bewusst ausgewaehlte Zweideutigkeiten :D
 
Zuletzt bearbeitet:
V

Vince999

Guest

AW: Was mache ich falsch???

Nachdem man mir bei meinem Problem nicht helfen konnte, habe ich anderweitig Hilfe bekommen. Jetzt läuft es, so, wie ich es haben wollte. Bin aber noch dabei, die Verlinkungen zu setzen.

Grüße
 
V

Vince999

Guest

AW: Was mache ich falsch???

Ersteinmal Frohe Ostern!!!

Nun mal zu einer Frage. Ich habe für die Thumbnails in iweb einen weißen Rahmen mit 3px Stärke eingestellt. Nachdem ich aber die html-Datei für Lightbox geändert habe, ist dieser Rahmen verschwunden. Und ich finde, die Gallerie sieht ohne Rahmen um die Thumbnails nicht so dolle aus.

Was muss ich ändern in der xyz.html, lightboxx.css oder/und lightbox.js, damit ich wieder Rahmen um die Thumbnails bekomme???

Und ist es möglich, den Rahmen eine andere Farbe zu geben, wenn ich mit der Maus über ein Thumbnail gehe???

Vielen Dank schonmal

EDIT: Ach ja, die Lightbox Daten, sind alle ungeändert, also so, wie sie heruntergeladen wurden.
 
Zuletzt bearbeitet von einem Moderator:

cebito

undefined

AW: Was mache ich falsch???

Code:
<img src="Tonemapping_NewYork_files/DSC_6948%20Kopie.jpg" alt="" [COLOR=Red]style=[/COLOR][COLOR=Red]"border: none;[/COLOR] height: 150px; width: 150px; " /></a>

...bei allen Vorschaubildern ;)

 
V

Vince999

Guest

AW: Was mache ich falsch???

Ja, dass steht bei allen Bildern drin. Könntest du mir nicht bitte einfach sagen, was ich da hinzu schreiben habe, damit wieder ein weißer 3px großer Rahmen drum ist.

Wenn ich folgendes schreibe, passiert nämlich nichts.
HTML:
<img src="DRI_Berlin_files/Reichstag%20Kopie.jpg" alt="" style="border: 10px; height: 150px; width: 150px; " /></a>
Vielleicht ist es auch grober Mist, was ich mir dabei gedacht habe. Bei Google finde ich stets nur Beiträge von Leuten, die den Rahmen weg haben wollen.
 

Top_Gun

Aktives Mitglied

AW: Was mache ich falsch???

Auch wenn der Thread schon paar Tage alt ist, möchte ich doch auf deine Frage "Was mache ich falsch???" antworten:
Du benutzt nichtsaussagende Threadüberschriften, so dass man nicht sofort weiß worum es geht und auch durch die Suche entsprechnede Threads schlechter finden kann. Dies solltest du beim nächsten mal besser machen.

PS: Satzzeichen sind keine Rudeltiere!
 
V

Vince999

Guest

AW: Was mache ich falsch???

Entschuldigung, es tut mir leid.

Ich wusste nicht, dass der Schreibstil, den man in seiner Freizeit tätigt, hier nicht gerne gesehen ist. Daher werde ich in naher Zukunft, auch nur noch ein Satzzeichen benutzen, um meiner Freude Ausdruck zu verleihen, dass mir nun doch noch geholfen wurde, nachdem ich, so denke ich es zumindest, mein Problem im Ausgangspost sehr detailliert beschrieben habe. Was ich sonst feststellen muss, dass es nicht immer der Fall ist, und man nachfragen muss, wo das eigentliche Problem liegt. Was vielleicht garnicht nötig gewesen wäre, da eh keiner genau darauf eingegangen ist. Eigentlich steht ja immernoch eine offene Frage im Raum rum. Aber ich möchte nicht kleinlich erscheinen.

Gut, das der Titel vielleicht "unpassend" ist, mag ich dir vielleicht sogar Recht geben. Aber wenn ich die Suche bemüht habe, und mit meinen Suchbegriffen (u.a. Lightbox Rahmen Border Farbe Color, in welcher kombination auch immer) kam ich auch überwiegend an Threads mit dem Titel "Lightbox". Da weiß man genauso wenig, wo das Problem liegt.

Ich werde in Zukunft versuchen, die Hinweise zu berücksichtigen und hoffe auf weitere gute gemeinsame Hilfsbereitschaft... :D
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.642
Beiträge
1.538.514
Mitglieder
67.559
Neuestes Mitglied
Andi Schäfer
Oben