Popupfenster mit Buttons?
Chris
- javascript
Hallo,
ich bin momentan darüber eine Bildergalerie für meine Homepage zu basteln. Leider stehe ich vor einigen Problemen die ich irgendwie nicht lösen kann....ich hoffe doch das ich hier Hilfe finden werde.
Ich habe folgendes vor: Ich würde gerne die Galerie so aufbauen, das man zu erst Thumbnails sieht. Wenn man dann auf irgend eins klickt, soll sich das in einen popupfenster vergrößert öffnen. Desweiterem soll die Möglichkeit bestehen, das man in diesem Popup-Fenster 3 Buttons unter dem Bild hat wo man einmal "zurück" (ein bild zurück), "schließen" (fenster schließen) und "weiter" (ein bild weiter) klicken kann.
Natürlich kann man das schließen auch weglassen weil man es via dem X schließen kann..aber es sieht einfach besser aus wenn man die Buttons hat.
So. Mein Problem: Ich schaff es nicht, bzw ich finde nichts im Internet was mir verrät wie ich buttons mit in das Popup-Fenster einbauen kann. (Die Buttons sind auch Bilder).
Ist es möglich Buttons mit einzufügen?
hier einmal der code, wie weit ich schon gekommen bin.
<table border="0" widht="100%" align="center">
<td><a href="javascript:popup('1.jpg',900,675+50,0);"
onMouseOver="window.status='0'; return true;"
onMouseOut="window.status=''; return true;"><img
src="1_klein.JPG" alt="0"
border="0"></a></td>
<td><a href="javascript:popup('2.jpg',900,675+50,0);"
onMouseOver="window.status='0'; return true;"
onMouseOut="window.status=''; return true;"><img
src="2_klein.JPG" alt="1"
border="0"></a></td>
<td><a href="javascript:popup('3.jpg',900,675+50,0);"
onMouseOver="window.status='0'; return true;"
onMouseOut="window.status=''; return true;"><img
src="3_klein.JPG" alt="2"
border="0"></a></td>
</table>
Vielen Dank schoneinmal für die Hilfe.
Gruß.
hier einmal der code, wie weit ich schon gekommen bin.
das ist kein code sondern ein traum - so ein script was du sucht gibts nimm ich mal an nit und es lohnt sich auch nicht sowas zu schreiben da es gute altanativen gibt - befass dich mal mit der lightbox
http://www.huddletogether.com/projects/lightbox2/
hier einmal der code, wie weit ich schon gekommen bin.
das ist kein code sondern ein traum - so ein script was du sucht gibts nimm ich mal an nit und es lohnt sich auch nicht sowas zu schreiben da es gute altanativen gibt - befass dich mal mit der lightbox
http://www.huddletogether.com/projects/lightbox2/
löl ok...aber würde halt geren was eigenes entwerfen und nicht was vorgefertigtes.
wäre es möglich statts 1.jpg einfach 1.html zu öffnen und in der html is das bild + die 3 buttons?
wäre es möglich statts 1.jpg einfach 1.html zu öffnen und in der html is das bild + die 3 buttons?
damit nein
aber was du mit buttons definierst erfolgt bei lightbox mit den pfeiltasten kannst ja versuchen das umzuschreiben oder zu erweitern das der halt auch noch buttons einfügt die dann die entsprechnde funktion beinhaltet
wäre es möglich statts 1.jpg einfach 1.html zu öffnen und in der html is das bild + die 3 buttons?
damit nein
aber was du mit buttons definierst erfolgt bei lightbox mit den pfeiltasten kannst ja versuchen das umzuschreiben oder zu erweitern das der halt auch noch buttons einfügt die dann die entsprechnde funktion beinhaltet
ok ich danke dir, werde mir das mal anschauen...hm...wird anscheinend leider doch nicht so wie ich das wollte..schade eigentl, bin normal fan von selbstgemachten sachen und nicht von vorlagen.
muss leider nochmal fragne....
habe jetzt das lightbox angeschaut und alles so eingepflegt...das problem ist nur...wenn ich jetzt die bilder öffne mit klick, dann kommen sie zwar, aber es kommt KEIN "Weiter" und "Zurück" Button bei den bildern..woran kann das liegen?
der Code hier:
<html>
<head>
<script language="JavaScript">
<!--
function popup (img,sx,sy,num) {
var winl = (screen.width-sx)/2;
var wint = (screen.height-sy)/2;
popupwin=window.open("","photo"+num,"toolbar=no,location=no,directories=no,status=no,menubar=no,top="+wint+",left="+winl+",width="+sx+",height="+sy+"");
popupwin.document.write("<html><head><META HTTP-EQUIV='imagetoolbar' CONTENT='no'></head><body style='CURSOR: url('maus.cur')' background='"+img+"' bgcolor='#ffffff' onClick='self.close()' oncontextmenu='return false' leftmargin='0' topmargin='0' bottommargin='0' rightmargin='0' marginheight='0' marginwidth='0'></body></html>");
popupwin.document.close();
}
// -->
</script>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
</head>
<link rel="stylesheet" type="text/css" href="Textmerkmale.css">
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<center>
<a href="photogalerie.html"> Zurück zur Galerie </a>
<table border=0 style="text-align:center;vertical-align:middle;" cellspacing="55">
<tr>
<td><a href="1.jpg" rel="lightbox"><img src="1_klein.jpg" border="0"></a></td>
<td><a href="2.jpg" rel="lightbox"><img src="2_klein.jpg" border="0"></a></td>
<td><a href="3.jpg" rel="lightbox"><img src="3_klein.jpg" border="0"></a></td>
<td><a href="4.jpg" rel="lightbox"><img src="4_klein.jpg" border="0"></a></td>
</tr>
</table>
<a href="Galerie.html">Zurück</a>
</html>
[latex]Mae govannen![/latex]
muss leider nochmal fragne....
habe jetzt das lightbox angeschaut und alles so eingepflegt...das problem ist nur...wenn ich jetzt die bilder öffne mit klick, dann kommen sie zwar, aber es kommt KEIN "Weiter" und "Zurück" Button bei den bildern..woran kann das liegen?
<td><a href="1.jpg" rel="lightbox"><img src="1_klein.jpg" border="0"></a></td>
<td><a href="2.jpg" rel="lightbox"><img src="2_klein.jpg" border="0"></a></td>
<td><a href="3.jpg" rel="lightbox"><img src="3_klein.jpg" border="0"></a></td>
<td><a href="4.jpg" rel="lightbox"><img src="4_klein.jpg" border="0"></a></td>
Du hast die Bilder nicht gruppiert; siehe Part 2
Cü,
Kai