Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JS]Galeria w js + lightbox
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
Zdrowy
Mam takowy problem. Próbuje połączyć lightboxa z galeria. Skorzystałem z wielu pewnie znanemu kodu galerii:

Kod
<script type="text/JavaScript">

browserName = navigator.appName;
browserVer = parseInt(navigator.appVersion);

ns3up = (browserName == "Netscape" && browserVer >= 3);
ie4up = (browserName.indexOf("Microsoft") >= 0 && browserVer >= 4);

function doPic(imgName) {
if (ns3up // ie4up) {
imgOn = ("" + imgName);
document.mainpic.src = imgOn;
}
}
</script>

<!--sekcja BODY-->
<table border="0" cellspacing="1" cellpadding="0" align="center">

<tr>
<td colspan="4" align="center"><img name="mainpic" src="galeria/1.jpg" alt="" width="364" border="0"></td>
</tr>

<tr>
<td height="10">
</td>
</tr>

<tr>
<td><a href="javascript:doPic('galeria/1.jpg');"><img src="galeria/1.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/2.jpg');"><img src="galeria/2.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/3.jpg');"><img src="galeria/3.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/4.jpg');"><img src="galeria/4.jpg" alt="" width="90" height="60" border="0"></a></td>
</tr>
<tr>
<td><a href="javascript:doPic('galeria/5.jpg');"><img src="galeria/5.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/6.jpg');"><img src="galeria/6.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/7.jpg');"><img src="galeria/7.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/8.jpg');"><img src="galeria/8.jpg" alt="" width="90" height="60" border="0"></a></td>
</tr>
<tr>
<td><a href="javascript:doPic('galeria/9.jpg');"><img src="galeria/9.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/10.jpg');"><img src="galeria/10.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/11.jpg');"><img src="galeria/11.jpg" alt="" width="90" height="60" border="0"></a></td>
<td><a href="javascript:doPic('galeria/12.jpg');"><img src="galeria/12.jpg" alt="" width="90" height="60" border="0"></a></td>
</tr>

</table>


Problemn polega na tym, by w miejscu:
Kod
<tr>
<td colspan="4" align="center"><img name="mainpic" src="galeria/1.jpg" alt="" width="364" border="0"></td>
</tr>


Ustawic to zdjęcie jako link:
Kod
<tr>
<td colspan="4" align="center"> <a href[b]"<??>"[/b]rel="lightbox" title="cos tam">  <img name="mainpic" src="galeria/1.jpg" alt="" width="364" border="0"> </a></td>
</tr>


Jak to zrobić w JSie by w miejscu <??> na bieżąco dawało link do zdjęcia?
wookieb
Nie rób tego w js tylko z poziomu php. Po co od nowa wynajdować koło?

I przeczytaj JESZCZE RAZ jak dobrze podłączyć lightboxa bo to "doPic" to trzeba wywalic w p....
Zdrowy
Kod
<table border="0" cellspacing="1" cellpadding="0" align="center" valign="top">
  <tr>
    <td colspan="3" align="center" valign="top"><a href="" rel="lightbox" title=""><img name="mainpic" src="zdjecia/<?=$obj->getID();?>/glowne.jpg" alt="" width="270" border="0"></a></td>
  </tr>
   <tr>
    <td height="10">
    </td>
  </tr>


   <?
   $kat = dir('zdjecia/'.$obj->getID());
   $i=1;
   while($poz = $kat->read()) {
     if (preg_match("/^.+..+$/i", $poz) && $poz!='Thumbs.db') {
        if($i==1 || ($i-1)%3==0) {
          echo '<tr>';
     }
   echo '<td><a href="javascript:doPic(\'zdjecia/'.$obj->getID().'/'.$poz.'\');"><img src="zdjecia/'.$obj->getID().'/'.$poz.'" alt="" width="90" height="60" border="0"></a></td>';

if($i%3==0) {
    echo '</tr>';
}
    $i++;
}
}
$kat->close();
?>
</table>
        </td></tr></table>


To wycinek kodu. ogolna idea byla taka, ze id obiektu to nazwa folderu w jakim sie znajduja zdjecia. Tylko jak w to kurcze lightboxa wpiąć.
wookieb
Mogleś napisać ten temat w przedszkolu...
Kod
echo '<td><a href="zdjecia/'.$obj->getID().'/'.$poz.'"><img src="zdjecia/'.$obj->getID().'/'.$poz.'" alt="" width="90" height="60" border="0"></a></td>';

Jeżeli nie zadziała to przykro mi ale sam sie bedziesz musial pomeczyc.
Zdrowy
Ale gdzie jest pies pogrzebany. W lightboxie ma sie otwierać tylko i wyłącznie to duże zdjęcie.
wookieb
A btw. Gdzie ty masz dołączonego lightboxa??
webdice
Proszę poprawić tytuł tematu, sam tag nie są tytułem.
Zdrowy
Jest zaimplementowany w sekcji head. Nic to raczej nie da przepisując te 4 linijki kodu, bo problem tkwi gdzie indziej.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.