Lightbox - Buttons fehlen

08154711

Erfahrenes Mitglied
Hallo,
Habe ein lightbox script gefunden, was auch gut funktioniert allerdings kann ich nicht nachvollziehen warum die Buttons für Next,Forward etc. nicht funktionieren. Der close Button ist als einziger vorhanden, die anderen fehlen, obwohl alle button im gleichen Verzeichnis liegen.
HTML:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<link rel="stylesheet" type="text/css" href="shadowbox-3.0.1/shadowbox.css" />
<script type="text/javascript" src="shadowbox-3.0.1/shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init();
</script>
</head>
<body>
<a href="myimage.jpg" rel="shadowbox">My Image</a>
<a href="img/Hydrangeas.jpg" rel="shadowbox">My Image</a>
<a href="img/Koala.jpg" rel="shadowbox">My Image</a>
<a href="img/Penguins.jpg" rel="shadowbox">My Image</a>
</body>
</html>
Code:
#sb-title-inner,#sb-info-inner,#sb-loading-inner,div.sb-message{font-family:"HelveticaNeue-Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:200;color:#fff;}
#sb-container{position:fixed;margin:0;padding:0;top:0;left:0;z-index:999;text-align:left;visibility:hidden;display:none;}
#sb-overlay{position:relative;height:100%;width:100%;}
#sb-wrapper{position:absolute;visibility:hidden;width:100px;}
#sb-wrapper-inner{position:relative;border:1px solid #303030;overflow:hidden;height:100px;}
#sb-body{position:relative;height:100%;}
#sb-body-inner{position:absolute;height:100%;width:100%;}
#sb-player.html{height:100%;overflow:auto;}
#sb-body img{border:none;}
#sb-loading{position:relative;height:100%;}
#sb-loading-inner{position:absolute;font-size:14px;line-height:24px;height:24px;top:50%;margin-top:-12px;width:100%;text-align:center;}
#sb-loading-inner span{background:url(loading.gif) no-repeat;padding-left:34px;display:inline-block;}
#sb-body,#sb-loading{background-color:#060606;}
#sb-title,#sb-info{position:relative;margin:0;padding:0;overflow:hidden;}
#sb-title,#sb-title-inner{height:26px;line-height:26px;}
#sb-title-inner{font-size:16px;}
#sb-info,#sb-info-inner{height:20px;line-height:20px;}
#sb-info-inner{font-size:12px;}
#sb-nav{float:right;height:16px;padding:2px 0;width:45%;}
#sb-nav a{display:block;float:right;height:16px;width:16px;margin-left:3px;cursor:pointer;background-repeat:no-repeat;}
#sb-nav-close{background-image: url(close.png);}
#sb-nav-next{background-image:url(next.png);}
#sb-nav-previous{background-image: url(play.png);}
#sb-nav-play{background-image:url(play.png);}
#sb-nav-pause{background-image:url(pause.png);}
#sb-counter{float:left;width:45%;}
#sb-counter a{padding:0 4px 0 0;text-decoration:none;cursor:pointer;color:#fff;}
#sb-counter a.sb-counter-current{text-decoration:underline;}
div.sb-message{font-size:12px;padding:10px;text-align:center;}
div.sb-message a:link,div.sb-message a:visited{color:#fff;text-decoration:underline;}
Danke im voraus
Ps.: falls das js script gebaucht wird lade ich es noch hoch
 
Hi,

kannst du mal den Link zur Seite nennen?

Der gezeigte Code gibt da wenig Aufschluß, weshalb da diverse Grafiken fehlen.

mfg Maik
 
Moin,

diese Buttons erscheinen, wenn man eine gallery nutzt(was du nicht tust)

http://www.shadowbox-js.com/usage.html hat gesagt.:
In addition to displaying single images and movies, Shadowbox is also capable of displaying galleries of content. In order to designate a link as part of a gallery, you must add the gallery name to the rel attribute between square brackets immediately following the word shadowbox. The following markup creates a gallery called "Vacation" with two pictures.

Code:
<a href="beach.jpg" rel="shadowbox[Vacation]">The Beach</a>
<a href="pier.jpg" rel="shadowbox[Vacation]">The Pier</a>
 

Neue Beiträge

Zurück