Hallo! Hoffe bin im richtigen Teil des Forums gelandet.
Hätte da eine Frage: Wie kann ich zwischen Bildern wechseln?
Zum Beispiel.: Mir wird ein Bild angezeigt. Links und Rechts von diesem sind Button mit "Nächtes" und "Vorheriges", oder auch Bilder ganz egal.
Hab schon gegoogelt,aber nichts gefunden.
Wäre sehr nett,wenn Ihr helfen könntet,gerne auch suführlicher ;D
Danke schoneinmal!
MfG
viele Wege führen nach Rom.....
Ich zeig dir 2:
1. Lerne die Grundlagen von Javascript und/oder php. Das reicht für so etwas doch recht simples und führt auch schnell zum Erfolg. Im Forum hier findest du mehr als genug Links zu guten Tutorials.
Nun eine kurze Zwischenbemerkung:
Hab schon gegoogelt,aber nichts gefunden.
Das kann so nicht stimmen. Jede billige Gallerie kann das, und mehr als genug davon sind auch opensource, so dass es kein Problem ist, sich einfach mal deren Quelltext anzusehen. So umfangreich sind diese nämlich nicht.
Aber das führt uns zu
2. Nimm eine fertige Gallerie und passe das Design an. An sich reicht auch schon die Lightbox.
Grüße,
Jojo
Hallo!
Dieses Problem hat sich nun erledigt,hat sich jedoch noch eine Frage aufgetan.http://www.chillys-world.de/part6/index.php?site=news# Hier ist rechts oben so eine schöne switchbox. Geht doch bestimmt mit DIV's oder?
wenn ja wäres klasse,wenn man vllt jemand sagen würde,wie ich das hinbekomme oder mir eine Page zum lernen psoten würde.
Danke,MfG
<html>
<head>
<title></title>
<meta name="description" content="">
<meta name="keywords" content="">
<style type="text/css">
.reiter {background-color: "#CCCCCC";}
.reitar a {font-family:arial,sans-serif; font-size:11px; font-weight:bold; position:relative; left:10px; top: 15px; color:"#0000FF"}
.reiter a:visited { color: "#021073";}
.reiter a:hover{font-family:arial, sans-serif;background-color: "#0000FF";font-size:13px;color:"#80FFFF";}
#Reiter1{background-color:"#CCCCCC";}
.karte {background-color:"#CCFFCC";}
.karte p {font-family:arial, sans-serif; font-size: 12px; margin-top:20px; margin-right:25px; margin-bottom: 10px; margin-left:20px;}
.karte h1 {font-family:arial, sans-serif; font-size: 16px; margin-top:20px; margin-right:25px; margin-bottom: 10px; margin-left:20px;}
#Karte1{background-color:"#CCCCCC";}
</style>
<script type="text/javascript">
var aktuellerReiter = "Reiter1";
var aktuelleKarte = "Karte1";
function einschalten(neuerReiter, neueKarte)
{if(aktuellerReiter!= neuerReiter){
var dieserReiter = document.getElementById(neuerReiter);
dieserReiter.style.backgroundColor = "#CCCCCC";
var alterReiter = document.getElementById(aktuellerReiter);
alterReiter.style.backgroundColor = "#CCCCCC";
aktuellerReiter = neuerReiter;
var dieseKarte = document.getElementById(neueKarte);
dieseKarte.style.visibility = "visible";
dieseKarte.style.backgroundColor = "#CCCCCF";
var alteKarte = document.getElementById(aktuelleKarte);
alteKarte.style.visibility = "hidden";
aktuelleKarte = neueKarte;
}}
</script>
</head>
<body bgcolor="#000000">
<div id="Reiter1" class="reiter" style="position:absolute; left:20px; top:40px; width:90px; height:30px; z-index:1;"><a href="javascript:einschalten('Reiter1', 'Karte1');">CounterStrike</a>
</div>
<div id="Reiter2" class="reiter" style="position:absolute; left:110px; top:40px; width:45px; height:30px; z-index:1;"><a href="javascript:einschalten('Reiter2', 'Karte2');">Doom</a>
</div>
<div id="Reiter3" class="reiter" style="position:absolute; left:154px; top:40px; width:135px; height:30px; z-index:1;"><a href="javascript:einschalten('Reiter3', 'Karte3');">Impossible Creatures</a>
</div>
<div id="Reiter4" class="reiter" style="position:absolute; left:287px; top:40px; width:94px; height:30px; z-index:1;"><a href="javascript:einschalten('Reiter4', 'Karte4');">Need 4 Speed</a>
</div>
<div id="Reiter5" class="reiter" style="position:absolute; left:380px; top:40px; width:50px; height:30px; z-index:1;"><a href="javascript:einschalten('Reiter5', 'Karte5');">Sacred</a>
</div>
<div id="Reiter6" class="reiter" style="position:absolute; left:428px; top:40px; width:64px; height:30px; z-index:1;"><a href="javascript:einschalten('Reiter6', 'Karte6');">WarCraft</a>
</div>
<div id="Reiter7" class="reiter" style="position:absolute; left:492px; top:40px; width:86px; height:30px; z-index:1;"><a href="javascript:einschalten('Reiter7', 'Karte7');">Clan-Bereich</a>
</div>
<div id="Karte1" class="karte" style="position:absolute; left:20px; top:70px; width:650px; height:300px; z-index:1; visibility: visible; overflow:auto;">
<h1>CounterStrike</h1>
<p>Patches, Mods und Maps</p>
<p><a href="#" target="Karte1" onMouseOver="window.status='Link X'; return true" onMouseOut="window.status=' '">LINK X</a></p>
</div>
<div id="Karte2" class="karte" style="position:absolute; left:20px; top:70px; width:650px; height:300px; z-index:1; visibility: hidden; overflow:auto;">
<h1>DOOM</h1>
<p>Patches, Mods und Maps</p>
<p><a href="#" target="Karte1" onMouseOver="window.status='Link X'; return true" onMouseOut="window.status=' '">LINK X</a></p>
</div>
<div id="Karte3" class="karte" style="position:absolute; left:20px; top:70px; width:650px; height:300px; z-index:1; visibility: hidden; overflow:auto;">
<h1>Impossible Creatures</h1>
<p>Patches, Mods und Maps</p>
<p><a href="#" target="Karte1" onMouseOver="window.status='Link X'; return true" onMouseOut="window.status=' '">LINK X</a></p>
</div>
<div id="Karte4" class="karte" style="position:absolute; left:20px; top:70px; width:650px; height:300px; z-index:1; visibility: hidden; overflow:auto;">
<h1>Need for Speed</h1>
<p>Patches, Mods und Maps</p>
<p><a href="#" target="Karte1" onMouseOver="window.status='Link X'; return true" onMouseOut="window.status=' '">LINK X</a></p>
</div>
<div id="Karte5" class="karte" style="position:absolute; left:20px; top:70px; width:650px; height:300px; z-index:1; visibility: hidden; overflow:auto;">
<h1>Sacred</h1>
<p>Patches, Mods und Maps</p>
<p><a href="#" target="Karte1" onMouseOver="window.status='Link X'; return true" onMouseOut="window.status=' '">LINK X</a></p>
</div>
<div id="Karte6" class="karte" style="position:absolute; left:20px; top:70px; width:650px; height:300px; z-index:1; visibility: hidden; overflow:auto;">
<h1>WarCraft</h1>
<p>Patches, Mods und Maps</p>
<p><a href="#" target="Karte1" onMouseOver="window.status='Link X'; return true" onMouseOut="window.status=' '">LINK X</a></p>
</div>
<div id="Karte7" class="karte" style="position:absolute; left:20px; top:70px; width:650px; height:300px; z-index:1; visibility: hidden; overflow:auto;">
<h1>Clan-Bereich</h1>
<p>Links zu Clan-Sites und die Möglichkeit für Clans, ihre War-Dates zu posten...</p>
<p><a href="#" target="Karte1" onMouseOver="window.status='Link X'; return true" onMouseOut="window.status=' '">War-Dates</a></p>
</div>
</body>
</html>