das war leider nur ein beispiel, wies dann aussehen soll. eingefügt werden die sachen per php. der user hat nämlich ein backend mit welchem er die bilder raufladen kann. das script erzeugt 2 bilder, das thumbnail und das richtige bild.
da das thumbnail in css geschrieben ist, hab ich nun das problem, den mit dem php code etwas im css einzufügen.
hier nochmal der code, erweitert um die php-teile. das grosse bild ist kein problem. das thumbnail will mir einfach nicht gelingen.
PHP
<style>
#holder {position:relative; background:transparent url(vertical-slide/photographer.jpg) 90px 0 no-repeat; margin-bottom:10px; width:750px; height:400px;}
#scrollbox {padding:0; margin:0; width:110px; list-style:none; height:500px; overflow:auto; float:right;}
#scrollbox li {float:left;}
#scrollbox a {display:block; color:#3333cc; text-decoration:none; border:1px solid #fff; width:75px; height:56px; float:left; padding:5px; font-family:"trebuchet ms", sans-serif; font-size:14px; text-align:center;}
<?php
include("./config.inc.php3");
//Verbindung aufbauen
$connection=mysql_connect($mysqlhost, $mysqluser, $mysqlpwd) or die("Verbindungsversuch fehlgeschlagen");
//Datenbank anwählen
mysql_select_db($mysqldb, $connection) or die("Konnte die Datenbank nicht waehlen.");
$sql = "SELECT * FROM Fotogalerie ORDER BY Position";
$sql_query = mysql_query($sql) or die("Keine erfolgreiche Abfrage");
//aktuelle Daten auswählen und in Variablen speichern
while ($data = mysql_fetch_array($sql_query))
{
$Pfad = $data['Bild'];
echo "#scrollbox a.slide".$data['ID']." {background:url(".$Pfad.") no-repeat center center;}";
}
?>
#scrollbox a span {display:block; position:absolute; left:-9999px; top:0;}
#scrollbox a span img {border:0;}
#scrollbox a:hover {border:1px solid #888;}
#scrollbox a:hover span {width:480px; height:500px; left:90px; background:#66cc00; z-index:100;}
#scrollbox a:active {border:1px solid #000;}
#scrollbox a:focus {border:1px solid #000; outline:0;}
* html #scrollbox a:active span {width:480px; height:400px; top:0; left:90px; color:#3333cc; background:#fff; z-index:-1;}
#scrollbox a:focus span {width:480px; height:500px; top:0; left:90px; color:#3333cc; background:#66cc00; z-index:10; outline:0;}
</style>
<div id="holder">
<ul id="scrollbox">
<?php
$sql = "SELECT * FROM Fotogalerie ORDER BY Position";
$sql_query = mysql_query($sql) or die("Keine erfolgreiche Abfrage");
//aktuelle Daten auswählen und in Variablen speichern
while ($data = mysql_fetch_array($sql_query))
{
//echo "<li><a class='slide".$data['ID']."' href='#nogo'><span><img src='./fotogross/".$data['Bild']."' alt="" /><br />TEST</span></a></li>";
echo "<li><a class='slidea".$data['ID']."' href='#nogo'><span><img src='./fotogross/".$data['Bild']."' alt='' /><br />Butterflies</span></a></li>";
}
?>
</ul>
</div>
Alles anzeigen
hast du ne idee?