Hallo Zusammen
Bin daran meine erste Page für einen Kunden zu programmieren
Hab die Seite erstellt, und ein Backend damit der Benutzer selber die Seite mit Inhalt füllen kann.
Jetzt hab ich ein Problem. Nämlich hab ich in meinem Code für die Bildergalerie die kleinen Vorschaubilder im CSS-Code definiert.
Ich möchte jetzt mit PHP die Daten aus der DB laden. Wie stell ich das mit dem CSS an? Bin verzweifelt..
Hier mal mein Code:
Code
<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;}
#scrollbox a.slidea {background:url(apollo11_1.jpg) no-repeat center center;}
#scrollbox a.slideb {background:url(apolloLaunch_1.jpg) no-repeat center center;}
#scrollbox a.slidec {background:url(bumper_1.jpg) no-repeat center center;}
#scrollbox a.slided {background:url(./bilderklein/Launch_1.jpg) no-repeat center center;}
#scrollbox a.slidee {background:url(./bilderklein/Liftoff_1.jpg) no-repeat center center;}
#scrollbox a.slidef {background:url(lightin_1.jpg) no-repeat center center;}
#scrollbox a.slideg {background:url(SR71_1.jpg) no-repeat center center;}
#scrollbox a.slideh {background:url(SR-71_1.jpg) no-repeat center center;}
#scrollbox a.slidei {background:url(STS-1_1.jpg) no-repeat center center;}
#scrollbox a.slidej {background:url(STS-121_1.jpg) no-repeat center center;}
#scrollbox a.slidek {background:url(dsc_0045_0.jpg) 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>
Alles anzeigen
HTML
<div id="holder">
<ul id="scrollbox">
<li><a class="slidea" href="#nogo"><span><img src="apollo11_2.jpg" alt="" /><br />Butterflies</span></a></li>
<li><a class="slideb" href="#nogo"><span><img src="apolloLaunch_2.jpg" alt="" /><br />Shy</span></a></li>
<li><a class="slidec" href="#nogo"><span><img src="bumper_2.jpg" alt="" /><br />Otter</span></a></li>
<li><a class="slided" href="#nogo"><span><img src="./bildergross/Launch_2.jpg" alt="" /><br />Monkey</span></a></li>
<li><a class="slidee" href="#nogo"><span><img src="./bildergross/Liftoff_2.jpg" alt="" /><br />Monkey2</span></a></li>
<li><a class="slidef" href="#nogo"><span><img src="lightin_2.jpg" alt="" /><br />Nuts</span></a></li>
<li><a class="slideg" href="#nogo"><span><img src="SR71_2.jpg" alt="" /><br />Pelicans</span></a></li>
<li><a class="slideh" href="#nogo"><span><img src="SR-71_2.jpg" alt="" /><br />Kiwi</span></a></li>
<li><a class="slidei" href="#nogo"><span><img src="STS-1_2.jpg" alt="" /><br />Lizard</span></a></li>
<li><a class="slidej" href="#nogo"><span><img src="STS-121_2.jpg" alt="" /><br />Paddling</span></a></li>
<li><a class="slidek" href="#nogo"><span><img src="dsc_0045.jpg" alt="" /><br />Trees</span></a></li>
</ul>
</div>
Alles anzeigen
Hab ich das Problem verständlich erklärt? Kann mir jmd. helfen?
Danke euch im Vorraus!
Freundliche Grüsse
Luca TheLehrling