Bilder untereinander statt Bildwechsel

**lobo3000** · 23.11.2009 17:03

Hallo!

Muss ja bekanntlich eine SchulHP erstellen, bin weder EDV Kustode noch geprüfter Informatiker...hab mich freiwillig gemeldet, da ich doch hin und wieder was mit HP erstellen zu tun hatte...

Doch hier mein(e) (3) Probleme(e):

1) hab einen Bildwechsel einbauen müssen, dafür einen Code im Netz gefunden, mit dem es unter FIREFOX auch gut funktioniert (wenn auch Position nicht in einer Tabellenzeile ist), jedoch im IE die Bilder anstatt sich wechseln, diese untereinander aufgelistet sind!

2) Weiters muss ich einen Bildindex anzeigen lassen, bei dem durch Klick auf ein Thumb das Bild größer angezeigt wird. Arbeite jedoch mit CSS und nicht mit frames...ist dies eigentlich möglich???

3) Seitens der Schulverwaltung wünscht man sich auch einen Loginbereich; hierfür ja MySQL, php von Nöten ... ist dies allzu schwer (für jemanden der in Programmieren keine Ahnung hat)?

Oder wäre das ganze etwas einfacher gewesen mit TYPO3 zu arbeiten??

Anbei der Link zur Versuchsseite: http://hphasner.hp.funpic.de

LG
lobo3000

Hier der Code:

HTML-Code:

<!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>
<link type="text/css" href="formate.css" rel="stylesheet" media="screen" />

<title>Hasnerschule</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />


<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.innerfade.js"></script>
	<script type="text/javascript">
	   $(document).ready(
				function(){
								
					$('ul#portfolio').innerfade({
						speed: 5000,
						timeout: 5000,
						type: 'sequence',
						containerheight: '120px'
					});
					
					$('.fade').innerfade({
						speed: 1000,
						timeout: 6000,
						type: 'random_start',
						containerheight: '120px'
					});
					
					

			});
  	</script>
		<style type="text/css" media="screen, projection">
			@import url(css/jq_fade.css);
		</style>		
</head>
<body>
<div id="container">

	<!-- anfang banner -->
	<table style width="100%" height="120px" cellpadding="0" cellspacing="0" border="0">
		<td width="121px" align="center"><img src="pics/logo _nms_ ohne_kleiner.jpg" alt="logo" /></td>
		<td width="75%">&nbsp;</td>
		<td width="25%" align="center" border="0">
			<ul id="portfolio">
				<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/1.JPG"/>
					</li>
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/2.JPG"  />
					</li>					
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/3.JPG" />
					</li>					
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/4.JPG" />
					</li>		
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/5.JPG" />
					</li>
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/6.JPG" />
					</li>
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/7.JPG" />
					</li>
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/8.JPG" />
					</li>
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/9.JPG" />
					</li>
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/10.JPG" />
					</li>
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/11.JPG" />
					</li>
					<li>
						<img src="http://www.traum-projekt.com/forum/pics/bilder/resized/12.JPG" />
					</li>					
				</ul>
		</td>
		</table>
	
				
			
		
	<!--<div id="banner" >
		<img src="pics/banner1.png" />
	</div>-->
	
	<!-- ende banner -->
	
	<div id="mainnavi" >
		<a href="index.html">Home </a>| <a href="schulprofil.html">Schulprofil</a> |  <a href="direktion.html">Direkton</a> |  <a href="aktuelles.html">Termine</a> | 
		<a href="lehrerinnen.html">LehrerInnen</a> |  <a href="kontakt.html">Kontakt </a>
	</div>
	
<!--	<div id="ticker"> saflkjsaöldf
	</div>-->
	
	<!-- ende mainnavi -->
	
	<div id="left">
	<h2>Hauptnavi</h2>
		<ul class="borderbottom">
			
			<ul>
				
						<li><a href="wirueberuns.html">Wir &uuml;ber uns</a></li>
						<li><a href="kreativ.html">Kreativer Schwerpunkt</a></li>
						<li><a href="musisch.html">Musischer Schwerpunkt</a></li>
						<li><a href="http://www.edumoodle.at/hasnerschule" target="_blank">Lernplattform</a></li>
						<li><a href="links">Links</a></li>
				
			</ul>
		</ul>
		<h2>Informelles</h2>
		
		<ul class="borderbottom">
			<ul>
				
						
						<li><a href="stundenplan.html">Stundenplan 2009/10</a></li>
						<li><a href="https://businesswebmail.telekom.at/">Webmail</a></li>
						<li><a href="archiv0708.html">Archiv 2007/08</a></li>
						<li><a href="archiv0607.html">Archiv 2006/07</a></li>
						<li><a href="archiv0506.html">Archiv 2005/06</a></li>
				
			</ul>
		
	</div> 
	
	<!-- ende linkes men&uuml; -->
	
	<div id="right">

		<div id="news">News:</div> 
		
	</div> 
	
	<!-- ende rechtes men&uuml; -->
	
	<div id="content">

		<h1>Willkommen</h1>
		<div id="text">
			
			<span style="font-size:12x">Wir freuen uns, Sie auf unserer Webseite begr&uuml;&szlig;en zu d&uuml;rfen und hoffen Ihnen einen guten "Einblick" in unsere 
			Schule mit ausreichenden Informationen bieten zu k&ouml;nnen.<br /><br /><br />
			
			<i><p style="color:#FF0000">Weitere Informationen oder Begrüßungstext eingeben!</p></i><br /><br />
				<!--<table width="auto" cols="2" border="0">
					 <tr>
					
						<td align="left"><u>Anschrift:</u></td><td align="left"> Lidmannskygasse 55</td>
					</tr>
					<tr>
					
						<td align="left">&nbsp;</td><td align="left">9020 Klagenfurt 
					</tr>
					<tr>
					
						<td>&nbsp;</td>
					</tr>
					<tr>
					
						<td align="left"><u>Telefon:</u></td><td align="left"> +43 (0) 463 xxxxxx</td>
					</tr>
				
					<tr>
					
						<td align="left"><u>Mail:</u></td><td align="left">xxx@nms-hasnerschule.ksn.at </td>
					</tr>
				</table> -->
				
		<!--	<table width="524" border="1" cellpadding="10" cellspacing="5"> 
				<tr> 
				  <td width="139" >
						
						
				  </td>
				  
					
				</tr>
			  </table>-->
			  
			  	<table width="524" border="0" cellpadding="5" cellspacing="2">
			  	<tr>
			  		<td><img src="pics/schule1k.jpg" alt="Hasnerschule1" width="206" height="118"></td>
					<td width="363"><p align="left">NMS-Hasnerschule (Neue Mittelschule)<br>
		
						mit musischem und kreativem Schwerpunkt<br><br />
						Lidmannskygasse 55 <br />
						9020 Klagenfurt</p>
					</td>
				</tr>
				
				<tr>
			  		<td><img src="pics/schulefrontk.jpg" alt="Hasnerschule2" width="206" height="118"></td>
					<td><p align="left">Tel.: +43 (0) 463 <span style="color:red;">xxxxxx</span> <br />
						(Direktor Prof. Reinhard K&Uuml;HR)<br><br />
						E-Mail.: <a href="mailto:"><i><span style="color:red;">Mailadresse einfügen</span></i></a><br>
		
					  Fax.: +43/463/344121<br>
					</p></td>
				</tr>
				

			
			</span>
		</div>
	</div>
	
 	<!--<div id="footer">
		Fussleiste
	</div>-->
	
</div>
</table>
</body>
</html>

**Boris** · 23.11.2009 17:19

Das mit der Slideshow hab ich hier auch eingebaut: http://bahalwan.de/

Schau es dir an und vergleiche (vor allem auch im CSS)

**lobo3000** · 23.11.2009 17:39

Hi!

Wie schaffst du sowas, wohl schon länger mit der Materie beschäftigt?!

Auf jeden Fall eine verdammt gute Seite!!! Lob!!!

LG
lobo3000

**Boris** · 23.11.2009 18:08

Naja, so besonders ist die auch nicht

**lobo3000** · 25.11.2009 18:23

Guten Abend!

Leider hab ich meinen Fehler noch immer nicht gefunden, warum die Bilder im IE untereinander angezeigt werden.
Klickt man auf einen weiteren Link (Schulprofil usw) kommt es jedoch so wie gewünscht zum Bildwechsel!

Kann mir jemand vielleicht kurz helfen?

LG
lobo3000

**Boris** · 25.11.2009 21:37

Du musst die Höhe beschränken, so dass nur ein Bild zu sehen ist (height geben und ein overflow: hidden) ... ich dachte du hättest mein CSS studiert?

zur Startseite vom TP

Thema: Bilder untereinander statt Bildwechsel

LinkBack

Themen-Optionen

Thema durchsuchen

Thema bewerten

Bilder untereinander statt Bildwechsel

Ähnliche Themen

Bilder untereinander rechts ausrichten

wie bilder rechts untereinander anordnen mit css

Statt der Bilder wird nur der Alternativtext angezeigt

Layer untereinander statt übereinander

Layer liegen untereinander statt übereinander

Aktive Benutzer

Aktive Benutzer