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.
Danke im voraus
Ps.: falls das js script gebaucht wird lade ich es noch hoch
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;}Ps.: falls das js script gebaucht wird lade ich es noch hoch
