Antworten auf deine Fragen:
Neues Thema erstellen

problem mit lightbox und dreamweaver

K

Konstrukt

Guest

hi,
ich arbeite gerade an einer website und möchte einige bilder im design mit
lightbox vergrößerbar machen. also habe ich lightbox implementiert und
drauflosprobiert. ich habe mich im internet schon ein wenig umgesehen,
aber keine lösung für mein problem gefunden. ich hoffe, hier kann mir
jemand weiterhelfen.

ich habe den hyperlink zum bild erstellt und in lightbox die erforderlichen
einstellungen vorgenommen.





dummerweise hat sich nach dem einstellen des hyperlinks das bild im
divlayer verschoben und die lightbox funktioniert auch nicht. beim klicken
auf das bild, wird die vergrößerte version in einer neuen seite geöffnet,
statt in einer eingeblendeten lightbox.



der lightbox ordner befindet sich im image ordner.
hier noch der quelltext der seite:
Code: 
<!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">
<head>
<title>Ferchels.de</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- ImageReady Styles (Ferchels.de.psd) -->
<style type="text/css">
<!--

#Ferchelsde-01_ {
    position:absolute;
    left:0px;
    top:0px;
    width:813px;
    height:10px;
}

#Ferchelsde-02_ {
    position:absolute;
    left:0px;
    top:10px;
    width:22px;
    height:622px;
}

#header_ {
    position:absolute;
    left:22px;
    top:10px;
    width:764px;
    height:118px;
}

#Ferchelsde-04_ {
    position:absolute;
    left:786px;
    top:10px;
    width:27px;
    height:622px;
}

#Ferchelsde-05_ {
    position:absolute;
    left:22px;
    top:128px;
    width:764px;
    height:15px;
}

#Ferchelsde-06_ {
    position:absolute;
    left:22px;
    top:143px;
    width:10px;
    height:489px;
}

#start-btn_ {
    position:absolute;
    left:32px;
    top:143px;
    width:121px;
    height:20px;
}

#Ferchelsde-08_ {
    position:absolute;
    left:153px;
    top:143px;
    width:8px;
    height:489px;
}

#content_ {
    position:absolute;
    left:161px;
    top:143px;
    width:419px;
    height:465px;
    background-image: url(images/content.jpg);
}

#Ferchelsde-10_ {
    position:absolute;
    left:580px;
    top:143px;
    width:9px;
    height:489px;
}

#image-01_ {
    position:absolute;
    left:589px;
    top:143px;
    width:187px;
    height:142px;
}

#Ferchelsde-12_ {
    position:absolute;
    left:776px;
    top:143px;
    width:10px;
    height:489px;
}

#Ferchelsde-13_ {
    position:absolute;
    left:32px;
    top:163px;
    width:121px;
    height:3px;
}

#dorf-btn_ {
    position:absolute;
    left:32px;
    top:166px;
    width:121px;
    height:20px;
}

#Ferchelsde-15_ {
    position:absolute;
    left:32px;
    top:186px;
    width:121px;
    height:3px;
}

#bios-btn_ {
    position:absolute;
    left:32px;
    top:189px;
    width:121px;
    height:20px;
}

#Ferchelsde-17_ {
    position:absolute;
    left:32px;
    top:209px;
    width:121px;
    height:3px;
}

#naturfreunde-btn_ {
    position:absolute;
    left:32px;
    top:212px;
    width:121px;
    height:20px;
}

#Ferchelsde-19_ {
    position:absolute;
    left:32px;
    top:232px;
    width:121px;
    height:3px;
}

#rad-btn_ {
    position:absolute;
    left:32px;
    top:235px;
    width:121px;
    height:20px;
}

#Ferchelsde-21_ {
    position:absolute;
    left:32px;
    top:255px;
    width:121px;
    height:3px;
}

#kontakt-btn_ {
    position:absolute;
    left:32px;
    top:258px;
    width:121px;
    height:20px;
}

#Ferchelsde-23_ {
    position:absolute;
    left:32px;
    top:278px;
    width:121px;
    height:3px;
}

#links-btn_ {
    position:absolute;
    left:32px;
    top:281px;
    width:121px;
    height:20px;
}

#Ferchelsde-25_ {
    position:absolute;
    left:589px;
    top:285px;
    width:187px;
    height:15px;
}

#image-02_ {
    position:absolute;
    left:589px;
    top:300px;
    width:187px;
    height:142px;
}

#Ferchelsde-27_ {
    position:absolute;
    left:32px;
    top:301px;
    width:121px;
    height:331px;
}

#Ferchelsde-28_ {
    position:absolute;
    left:589px;
    top:442px;
    width:187px;
    height:190px;
}

#Ferchelsde-29_ {
    position:absolute;
    left:161px;
    top:608px;
    width:419px;
    height:24px;
}

#page-zentrieren{
margin-left: auto;
margin-right: auto;
position:relative;
width:813px;
height:632px;
z-index:1;
}

-->
</style>
<!-- End ImageReady Styles -->
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<link rel="stylesheet" href="../../../../../../../../lightbox_assets/css/lightbox.css" type="text/css" media="screen" />
<script src="../../../../../../../../lightbox_assets/js/prototype.js" type="text/javascript"></script>
<script src="../../../../../../../../lightbox_assets/js/scriptaculous.js?load=effects" type="text/javascript"></script>
<script src="../../../../../../../../lightbox_assets/js/lightbox.js" type="text/javascript"></script>
</head>
<body style="background-color:#FFFFFF;" onload="MM_preloadImages('images/dorf_btn_h.jpg','images/bios_btn_h.jpg','images/naturfreunde_btn_h.jpg','images/rad_btn_h.jpg','images/kontakt_btn_h.jpg','images/links_btn_h.jpg');initLightbox()">



  <!-- ImageReady Slices (Ferchels.de.psd) -->
<div id="page-zentrieren">
<div id="container">
<div id="Tabelle_01">
    <div id="Ferchelsde-01_">
        <div align="center"><img id="Ferchelsde_01" src="images/Ferchelsde_01.jpg" width="813" height="10" alt="" />    </div>
    </div>
    <div id="Ferchelsde-02_">
        <div align="center"><img id="Ferchelsde_02" src="images/Ferchelsde_02.jpg" width="22" height="622" alt="" />    </div>
    </div>
    <div id="header_">
        <div align="center"><img id="header" src="images/header.jpg" width="764" height="118" alt="" />    </div>
    </div>
<div id="Ferchelsde-04_">
        <div align="center"><img id="Ferchelsde_04" src="images/Ferchelsde_04.jpg" width="27" height="622" alt="" />    </div>
</div>
    <div id="Ferchelsde-05_">
        <div align="center"><img id="Ferchelsde_05" src="images/Ferchelsde_05.jpg" width="764" height="15" alt="" />    </div>
    </div>
    <div id="Ferchelsde-06_">
        <div align="center"><img id="Ferchelsde_06" src="images/Ferchelsde_06.jpg" width="10" height="489" alt="" />    </div>
    </div>
    <div id="start-btn_">
      <div align="center"><a href="index.html"><img src="images/start_btn_h.jpg" alt="HOME" name="start_btn" width="121" height="20" border="0" id="start_btn" /></a></div>
    </div>
<div id="Ferchelsde-08_">
        <div align="center"><img id="Ferchelsde_08" src="images/Ferchelsde_08.jpg" width="8" height="489" alt="" />    </div>
</div>
    <div id="content_">
      <div align="center">
        <h4><strong>Willkommen</strong></h4>
      </div>
    </div>
<div id="Ferchelsde-10_">
        <div align="center"><img id="Ferchelsde_10" src="images/Ferchelsde_10.jpg" width="9" height="489" alt="" />    </div>
</div>
    <div id="image-01_">
        <div align="center"><a href="images/IMG00009.JPG" title="der see" rel="lightbox[IMG00009]"><img src="images/image_01.jpg" alt="" name="image_01" width="187" height="142" id="image_01" /></a> </div>
    </div>
    <div id="Ferchelsde-12_">
        <div align="center"><img id="Ferchelsde_12" src="images/Ferchelsde_12.jpg" width="10" height="489" alt="" />    </div>
    </div>
    <div id="Ferchelsde-13_">
        <div align="center"><img id="Ferchelsde_13" src="images/Ferchelsde_13.jpg" width="121" height="3" alt="" />    </div>
    </div>
    <div id="dorf-btn_">
        <div align="center"><a href="dorf_html">
          <img src="images/dorf_btn.jpg" alt="DAS DORF" width="121" height="20" border="0" id="dorf_btn" onmouseover="MM_swapImage('dorf_btn','','images/dorf_btn_h.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </div>
    </div>
<div id="Ferchelsde-15_">
        <div align="center"><img id="Ferchelsde_15" src="images/Ferchelsde_15.jpg" width="121" height="3" alt="" />    </div>
</div>
    <div id="bios-btn_">
        <div align="center"><a href="bios.html">
          <img src="images/bios_btn.jpg" alt="BIOSPHAERENRESERVAT" width="121" height="20" border="0" id="bios_btn" onmouseover="MM_swapImage('bios_btn','','images/bios_btn_h.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </div>
    </div>
<div id="Ferchelsde-17_">
        <div align="center"><img id="Ferchelsde_17" src="images/Ferchelsde_17.jpg" width="121" height="3" alt="" />    </div>
</div>
    <div id="naturfreunde-btn_">
        <div align="center"><a href="naturfreunde.html">
          <img src="images/naturfreunde_btn.jpg" alt="NATURFREUNDE" width="121" height="20" border="0" id="naturfreunde_btn" onmouseover="MM_swapImage('naturfreunde_btn','','images/naturfreunde_btn_h.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </div>
    </div>
<div id="Ferchelsde-19_">
        <div align="center"><img id="Ferchelsde_19" src="images/Ferchelsde_19.jpg" width="121" height="3" alt="" />    </div>
</div>
    <div id="rad-btn_">
        <div align="center"><a href="rad.html">
          <img src="images/rad_btn.jpg" alt="RADWANDERN" width="121" height="20" border="0" id="rad_btn" onmouseover="MM_swapImage('rad_btn','','images/rad_btn_h.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </div>
    </div>
<div id="Ferchelsde-21_">
        <div align="center"><img id="Ferchelsde_21" src="images/Ferchelsde_21.jpg" width="121" height="3" alt="" />    </div>
</div>
    <div id="kontakt-btn_">
        <div align="center"><a href="kontakt.html">
          <img src="images/kontakt_btn.jpg" alt="KONTAKT" width="121" height="20" border="0" id="kontakt_btn" onmouseover="MM_swapImage('kontakt_btn','','images/kontakt_btn_h.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </div>
    </div>
<div id="Ferchelsde-23_">
        <div align="center"><img id="Ferchelsde_23" src="images/Ferchelsde_23.jpg" width="121" height="3" alt="" />    </div>
</div>
    <div id="links-btn_">
        <div align="center"><a href="links.html">
          <img src="images/links_btn.jpg" alt="LINKS" width="121" height="20" border="0" id="links_btn" onmouseover="MM_swapImage('links_btn','','images/links_btn_h.jpg',1)" onmouseout="MM_swapImgRestore()" /></a> </div>
    </div>
<div id="Ferchelsde-25_">
        <div align="center"><img id="Ferchelsde_25" src="images/Ferchelsde_25.jpg" width="187" height="15" alt="" />    </div>
</div>
    <div id="image-02_">
        <div align="center"><img id="image_02" src="images/image_02.jpg" width="187" height="142" alt="" />    </div>
    </div>
    <div id="Ferchelsde-27_">
        <div align="center"><img id="Ferchelsde_27" src="images/Ferchelsde_27.jpg" width="121" height="331" alt="" />    </div>
    </div>
    <div id="Ferchelsde-28_">
        <div align="center"><img id="Ferchelsde_28" src="images/Ferchelsde_28.jpg" width="187" height="190" alt="" />    </div>
    </div>
    <div id="Ferchelsde-29_">
        <div align="center"><img id="Ferchelsde_29" src="images/Ferchelsde_29.jpg" width="419" height="24" alt="" />    </div>
    </div>
</div>
<div align="center">
  <input type="submit" name="button" id="button" value="Senden" />
  <!-- End ImageReady Slices -->
</div>
</div>
</div>
</body>
</html>

weiß jemand, wie ich das problem lösen kann?
 

cebito

cebito

undefined

AW: problem mit lightbox und dreamweaver

Code: 
<link rel="stylesheet" href="[COLOR=Red]../../../../../../../../[/COLOR]lightbox_assets/css/lightbox.css" type="text/css" media="screen" />
<script src="[COLOR=Red]../../../../../../../../[/COLOR]lightbox_assets/js/prototype.js" type="text/javascript"></script>
<script src="[COLOR=Red]../../../../../../../../[/COLOR]lightbox_assets/js/scriptaculous.js?load=effects" type="text/javascript"></script>
<script src="[COLOR=Red]../../../../../../../../[/COLOR]lightbox_assets/js/lightbox.js" type="text/javascript"></script>
Bist du dir sicher, das diese Pfade stimmen? Ansonsten schau dir mal das von sokie an. Im übrigen eignet sich die Entwurfsansicht von DW nicht um Webseiten zu erstellen, das böse Erwachen kommt dann im Browser.

Edit: ach ja, die Verschiebung kommt wohl durch den Rahmen der standartmäßig bei Links hinzugefügt wird, den bekommst du weg indem du in der css definierst:
Code: 
a img {
text-decoration:none;
border:none;
}
 
Zuletzt bearbeitet:
K

Konstrukt

Guest

AW: problem mit lightbox und dreamweaver

:uhm: oops.
nein, die links sind natürlich nicht richtig!
das hat man nun vom durchmachen...

ich habe sie schon geändert und es funktioniert.
die veränderte position im divlayer durch den hyperlink ist allerdings nach wie
vor ein problem. ich probier mal weiter herum. vielleicht finde ich ja durch
zufall eine lösung. try&error for the win!

danke auch für den link zum tutorial.
ich lade es gerade herunter und werde es dann auch durchgehen.

edit:
achso, dem hyperlink wurde automatisch ein rahmen hinzugefügt.
alles klar. das war in den videotuts, die ich mir ansah, nicht ersichtlich.
vielen, vielen dank!
 
Zuletzt bearbeitet von einem Moderator:
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
Zu den Gratis-Inhalten

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Gesamt: 186 (Mitglieder: 3, Gäste: 183)
Robots: 233

Statistik des Forums

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