Mal was neues..o.O.

Alienx

Heyo,

dachte mir, da es hier ohnehin so eine Rubrik gibt, dass ich meinen Senf auch mal dazu geben und einen "Spiele"-Thread eröffnen werde.

Allerdings soll das ganze am Ende ja auch ein halbwegs sinnvolles Ergebnis liefern, weshalb ich mir das Spielkonzept wie folgt vorstelle:

Ein User postet ein Stück (vollständigen) HTML-Code mit oder ohne sichtbaren Inhalt, das bleibt dem User selbst überlassen. Der User danach postet wiederum ein weiteres Stück ergänzenden HTML Code zu dem bereits bestehenden HTML-Fragment.

Das ganze geht dann immer so weiter. Jetzt soll das ganze ja nicht nur einfach zu einer Ansammlung von zusammenhangslosem Codeabfall führen, am Ende soll dabei eine vollständ strukturierte HTML-Seite mit passenden Layout und Design entsehen.

Bilder dürfen verwendet werden, ebenso JavaScript. Für Bilder gilt aber nach wie vor, das Urheberrecht zu beachten.

CSS ist ebenfalls erlaubt, allerdings in dem Fall nur als Notation im Head oder inline-style-Element.

Ich hoffe, dass der ein oder andere sich ab und an einmal hier beteiligen wird. Ich wünsche allen Teilnehmern viel Spaß und hoffe, dass am Ende auch wirklich etwas sinnvolles dabei herauskommt.

Achso, ich mache auch gleich mal den Anfang mit einem groben XHTML Gerüst:

HTML

<!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"
       xml:lang="de" lang="de">
       <head>


               <title>Mal was neues...o.O.</title>




</head>


<body>


</body>
</html>

Alles anzeigen

Bitte postet bei einer Ergänzung immer den vollständigen Code und markiert euren ergänzenden Code.

Das Spiel läuft ab heute einen Monat, also bis zum 6.6.08. Dann werde ich den Quellcode in eine *.html Datei kopieren und das Ergebnis hier präsentieren. Danach geht es wieder von vorn los.

Mfg Alienx

The User

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Mal was neues...o.O.</title>

</head>

gelöschter User

HTML

<!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"
xml:lang="de" lang="de">
<head>


<title>Mal was neues...o.O.</title>
<style type="text/css">
#hauptbanner {
width:1000px;
height: 250px;
}
</style>


</head>


mfg


<body>
<div id="main">
<div id="hauptbanner">
</div>
<div id="navi">
</div>
<div id="content">
</div>
<div id="status">
</div>
<div id="footer">
</div>
</body>
</html>

Alles anzeigen

habe jetzt nur 1 was hinzugefügt ist das so recht?
übrigens ... geile Idee!

The User

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Mal was neues...o.O.</title>
<style type="text/css">
#hauptbanner {
width:1000px;
height: 250px;
}
#content {
width:750px;
height: 750px;
margin: 0 auto;
overflow: scroll;
</style>

</head>

mfg

Alienx

HTML

<!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" 
xml:lang="de" lang="de"> 


<head> 
         <title>Mal was neues...o.O.</title> 
 
<style type="text/css"> 
#hauptbanner { 
width:1000px; 
height: 250px; 
} 
#content { 
width:750px; 
height: 750px; 
margin: 0 auto; 
overflow: scroll; 
}
div#navi {
width : 100%;
height : 25px;
border : 1px solid #999999;
background : #5d5d5d;
font : normal 90% Verdana;
}
#navi a:link, #navi a:visited, #navi a:active {
color : #999999;
text-decoration : none;
}
#navi a:hover, #navi a:focus {
color : #008000;
text-decoration : underline;
}
</style> 


</head> 


<body> 


<div id="main"> 


<div id="hauptbanner"> 
</div> 


<div id="navi"> 


<ul>
    [*]<a href="index.html"<Startseite</a>
    [*][url='galerie.html']Galerie[/url]
    [*]<a href="about.html"<About</a>
    [*][url='kontakt.html']Kontaktformular[/url]
    [*][url='impressum.html']Impressum[/url]
[/list]


</div> 


<div id="content"> 
</div> 


<div id="status"> 
</div> 


<div id="footer"> 
</div> 


</div> 


</body> 
</html>

Alles anzeigen

Da hat sich ein kleines "mfg" zwischen <head> und <body> geschlichen, ich habe es mal rausgenommen.

Btw. eine kleine Anmerkung noch, nur damit es nachher keine Missverständnisse gibt: Es ist natürlich nicht gestattet, den bereits bestehenden Code zu ändern, lediglich, ihn zu ergänzen.

MfG Alienx

gelöschter User

ok aber ihn valide zu machen wäre ok?
und das mfg war von mir sry

HTML

<!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"
xml:lang="de" lang="de">


<head>
         <title>Mal was neues...o.O.</title>
 
<style type="text/css">
#hauptbanner {
width:1000px;
height: 250px;
}
#content {
width:750px;
height: 750px;
margin: 0 auto;
overflow: scroll;
}
div#navi {
width : 100%;
height : 25px;
border : 1px solid #999999;
background : #5d5d5d;
font : normal 90% Verdana;
}
#navi a:link, #navi a:visited, #navi a:active {
color : #999999;
text-decoration : none;
}
#navi a:hover, #navi a:focus {
color : #008000;
text-decoration : underline;
}


#footer {
width:1000px;
height 75px;
}
</style>


</head>


<body>


<div id="main">


<div id="hauptbanner">
</div>


<div id="navi">


<ul>
    [*]<a href="index.html"<Startseite</a>
    [*][url='galerie.html']Galerie[/url]
    [*]<a href="about.html"<About</a>
    [*][url='kontakt.html']Kontaktformular[/url]
    [*][url='impressum.html']Impressum[/url]
[/list]


</div>


<div id="content">
</div>


<div id="status">
</div>


<div id="footer">
[C] and Design by [url]www.forum-hilfe.de[/url] 
</div>


</div>


</body>
</html>

Alles anzeigen

Sport-Tipps

HTML

<!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"
xml:lang="de" lang="de">


<head>
<META NAME="DC.Creator" CONTENT="Forum-Hilfe-User">
<META NAME="DC.Rights" CONTENT="© Alle Rechte liegen bei den Autoren">
<META NAME="DC.Description" CONTENT="Mal eine neue Seite, erstellt von Forum-Hilfe.de">
<META NAME="title" CONTENT="Mal etwas neues">
<META NAME="keywords" CONTENT="Mal was neues, Forum Hilfe,">




         <title>Mal was neues...o.O.</title>
 
<style type="text/css">
#hauptbanner {
width:1000px;
height: 250px;
}
#content {
width:750px;
height: 750px;
margin: 0 auto;
overflow: scroll;
}
div#navi {
width : 100%;
height : 25px;
border : 1px solid #999999;
background : #5d5d5d;
font : normal 90% Verdana;
}
#navi a:link, #navi a:visited, #navi a:active {
color : #999999;
text-decoration : none;
}
#navi a:hover, #navi a:focus {
color : #008000;
text-decoration : underline;
}


#footer {
width:1000px;
height 75px;
}
</style>


</head>


<body>


<div id="main">


<div id="hauptbanner">
</div>


<div id="navi">


<ul>
    [*]<a href="index.html"<Startseite</a>
    [*][url='galerie.html']Galerie[/url]
    [*]<a href="about.html"<About</a>
    [*][url='kontakt.html']Kontaktformular[/url]
    [*][url='impressum.html']Impressum[/url]
[/list]


</div>


<div id="content">
</div>


<div id="status">
</div>


<div id="footer">
[C] and Design by [url]www.forum-hilfe.de[/url]
</div>


</div>


</body>
</html>

Alles anzeigen

synaptic

HTML

<!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"
xml:lang="de" lang="de">


<head>
<META NAME="DC.Creator" CONTENT="Forum-Hilfe-User">
<META NAME="DC.Rights" CONTENT="© Alle Rechte liegen bei den Autoren">
<META NAME="DC.Description" CONTENT="Mal eine neue Seite, erstellt von Forum-Hilfe.de">
<META NAME="title" CONTENT="Mal etwas neues">
<META NAME="keywords" CONTENT="Mal was neues, Forum Hilfe,">




         <title>Mal was neues...o.O.</title>
 
<style type="text/css">
body{
margin:0;
padding:0;
}


#hauptbanner {
background:url("http://home.arcor.de/synaptic/hier/header_fhs.jpg");
width:1000px;
height: 250px;
margin:0 auto;
}
#content {
width:750px;
height: 750px;
margin: 0 auto;
overflow: scroll;
}
div#navi {
width : 100%;
height : 25px;
border : 1px solid #999999;
background : #5d5d5d;
font : normal 90% Verdana;
}
#navi a:link, #navi a:visited, #navi a:active {
color : #999999;
text-decoration : none;
}
#navi a:hover, #navi a:focus {
color : #008000;
text-decoration : underline;


}
#navi ul{
list-style:none;
}


#navi ul li{
display: inline;
padding-right:10px;
}


#footer {
width:1000px;
height 75px;
}
</style>


</head>


<body>


<div id="main">


<div id="hauptbanner">
</div>


<div id="navi">


<ul>
    [*][url='index.html']Startseite[/url]
    [*][url='galerie.html']Galerie[/url]
    [*][url='about.html']About[/url]
    [*][url='kontakt.html']Kontaktformular[/url]
    [*][url='impressum.html']Impressum[/url]
[/list]


</div>


<div id="content">
</div>


<div id="status">
</div>


<div id="footer">
[C] and Design by [url]www.forum-hilfe.de[/url]
</div>


</div>


</body>
</html>

Alles anzeigen

mmh irgendwie muss noch festgelegt werden, wieviel man maximal machen darf...
hab jetzt n bissi styles geschraubt und nen headerdummy gebaut..
die eigenen sachen darf man ja noch ändern oder??
hab den header deshalb gemacht, damit man direkt sieht wofür der traurige platz überm menü is..^^

Alienx

Hi,

um kurz auf die Fragen einzugehen:

Nein, nachträgliche Änderungen -auch die, des eigenen Codes- sind nicht erlaubt, würde sonst zu viel Verwirrung geben.

Den Code zu validieren, ist natürlich jederzeit gestattet.

Für den Umfang der Ergänzungen gibt es natürlich keine Begrenzung.

MfG Alienx

The User

So, ist ein wenig Verständigung erlaubt?
Das Layout:
Wir stehen jetzt vor verschiedenen Varianten, die Anlage von #content und #status spricht für ein dreispaltiges Layout, #navi dagegen für ein Untereinander, wollen wir uns einigen?
Es macht einfach keinen Sinn, gleichzeitig die horizontale Navi und einen #content-Bereich, der deutlich kleiner als der Banner ist, bestehen zu lassen.
Also sagt, was ihr wollt, ich hab für beides ein paar Ideen.

synaptic

öhhm liegt nicht genau darin der sinn des spiels?? einfach mal zu machen ohne sich abzusprechen?
also ich hab die bnavi grad horizontal gemacht, weil mir der graue balken so ins gesicht gesprungen ist...
und das bild hab ich gemacht, weil mir der leere headerbereich zu fad aussah.., also mach einfach mal.. der nächste muss sich dann mit deinem werk rumschlagen ;o)
und ne horizontale navi spricht ja net gegen dreispaltiges layout...

The User

Okay, ich versuche es.

HTML

<!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" 
xml:lang="de" lang="de"> 


<head> 
<META NAME="DC.Creator" CONTENT="Forum-Hilfe-User"> 
<META NAME="DC.Rights" CONTENT="© Alle Rechte liegen bei den Autoren"> 
<META NAME="DC.Description" CONTENT="Mal eine neue Seite, erstellt von Forum-Hilfe.de"> 
<META NAME="title" CONTENT="Mal etwas neues"> 
<META NAME="keywords" CONTENT="Mal was neues, Forum Hilfe,"> 




         <title>Mal was neues...o.O.</title> 

<style type="text/css"> 
body{ 
margin:0; 
padding:0; 
} 
#main {
margin: 0 auto;
}
#hauptbanner { 
background:url("http://home.arcor.de/synaptic/hier/header_fhs.jpg"); 
width:1000px; 
height: 250px; 
margin:0 auto; 
} 
#content { 
width:750px; 
height: 750px; 
margin-left: 25px;
overflow: scroll; 
float: left;
}
#midsection {
margin-top: 25px;
}
#status {
width: 100px;
margin-left: 25px;
float: left;
}
#sublinks {
width: 100px;
}
div#navi { 
width : 100%; 
height : 25px; 
border : 1px solid #999999; 
background : #5d5d5d; 
font : normal 90% Verdana; 
} 
#navi a { 
color : #999999; 
text-decoration : none; 
} 
#navi a:hover, #navi a:focus { 
color : #008000; 
text-decoration : underline; 


} 
#navi ul{ 
list-style:none; 
} 


#navi ul li{ 
display: inline; 
padding-right:10px; 
} 


#footer { 
width:1000px; 
height 75px; 
margin-top: 25px;
} 
</style> 


</head> 


<body> 


<div id="main"> 


<div id="hauptbanner"> 
</div> 


<div id="navi"> 


<ul> 
    [*][url='index.html']Startseite[/url] 
    [*][url='galerie.html']Galerie[/url] 
    [*][url='about.html']About[/url] 
    [*][url='kontakt.html']Kontaktformular[/url] 
    [*][url='impressum.html']Impressum[/url] 
[/list] 


</div> 


<div id="midsection">
<div id="sublinks">
</div>


<div id="content"> 
</div> 


<div id="status"> 
</div> 
</div>


<div id="footer"> 
[C] and Design by [url]www.forum-hilfe.de[/url] 
</div> 


</div> 


</body> 
</html>

Alles anzeigen

Also die margins könnt ihr ruhig ein wenig anpassen, zumindest bei #footer und #midsection.

::RMB::

HTML

<!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"
xml:lang="de" lang="de">


<head>
<META NAME="DC.Creator" CONTENT="Forum-Hilfe-User">
<META NAME="DC.Rights" CONTENT="© Alle Rechte liegen bei den Autoren">
<META NAME="DC.Description" CONTENT="Mal eine neue Seite, erstellt von Forum-Hilfe.de">
<META NAME="title" CONTENT="Mal etwas neues">
<META NAME="keywords" CONTENT="Mal was neues, Forum Hilfe,">




         <title>Mal was neues...o.O.</title>
 
<style type="text/css">
body {
 background-color:#F1F1F1;
 margin:0;
 padding:0;
}
body, input, textarea, select {
 font-family:Verdana,Arial,Helvetica,sans-serif;
 color:#333;
 font-size:12px;
 line-height:18px;
}


#main {
margin: 0 auto;
}
#hauptbanner {
background:url("http://home.arcor.de/synaptic/hier/header_fhs.jpg");
width:1000px;
height: 250px;
margin:0 auto;
}
#content {
width:750px;
height: 750px;
margin-left: 25px;
overflow: scroll;
float: left;
}
#content h1 {
font-size:1.5em;
}
#midsection {
margin-top: 25px;
}
#status {
width: 100px;
margin-left: 25px;
float: left;
}
#sublinks {
width: 100px;
}
div#navi {
width : 100%;
height : 25px;
border : 1px solid #999999;
background : #5d5d5d;
font : normal 90% Verdana;
}
#navi a {
color : #999999;
text-decoration : none;
}
#navi a:hover, #navi a:focus {
color : #008000;
text-decoration : underline;


}
#navi ul{
list-style:none;
}


#navi ul li{
display: inline;
padding-right:10px;
}


#footer {
width:1000px;
height 75px;
margin-top: 25px;
}
</style>


</head>


<body>


<div id="main">


<div id="hauptbanner">
</div>


<div id="navi">


<ul>
    [*][url='index.html']Startseite[/url]
    [*][url='galerie.html']Galerie[/url]
    [*][url='about.html']About[/url]
    [*][url='kontakt.html']Kontaktformular[/url]
    [*][url='impressum.html']Impressum[/url]
[/list]


</div>


<div id="midsection">
<div id="sublinks">
</div>


<div id="content">
<h1>Wilkommen</h1>




Ich bin eine Website ohne Content und Design</p>
</div>


<div id="status">
</div>
</div>


<div id="footer">
[C] and Design by [url]www.forum-hilfe.de[/url]
</div>


</div>


</body>
</html>

Alles anzeigen

Blödes Spiel, blind HTML Code schreiben ohne eine Design Vorgabe zu haben

Alienx

@RMB: Wenn es dir nicht gefällt, musst du ja nicht "blind" mitschreiben. Das ist nunmal das Prinzip des Spiels, einfach mal zu sehen, was dabei herauskommt, eben ohne Vorlage, sonst wäre es nicht mehr als ein Wettbewerb oder ein Kontest oder ähnliches.

Jeder soll nach Gutdünken etwas beitragen, so habe ich mir das Konzept vorgestellt.

MfG Alienx

synaptic

also ich bin dafür RMBs variation nicht zu benutzen, wer keinen sinn im spiel sieht, brauch net mitmachen...
außerdem ist diese variante auch kein bisserl förderlich für unser vorankommen..

dennn,RMB du hast auch nicht, "ich bin destruktiv und repulsiv und mich hat niemand lieb" auf der stirn stehen!
wenn du nen die welt-ist-scheisse-tag hast, hab den, aber lass deinen frust nicht bei denen ab, die sich das grau etwas bunter machen!
nimm einfach mal weniger und komm runter!

synaptic

so und weil ja sonst bisher keiner weitergemacht hat... hab ich mal was gebaut ;o)

HTML

<!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"
xml:lang="de" lang="de">


<head>
<META NAME="DC.Creator" CONTENT="Forum-Hilfe-User">
<META NAME="DC.Rights" CONTENT="© Alle Rechte liegen bei den Autoren">
<META NAME="DC.Description" CONTENT="Mal eine neue Seite, erstellt von Forum-Hilfe.de">
<META NAME="title" CONTENT="Mal etwas neues">
<META NAME="keywords" CONTENT="Mal was neues, Forum Hilfe,">




         <title>Mal was neues...o.O.</title>
 
<style type="text/css">
body{
margin:0;
padding:0;
background: url("http://home.arcor.de/synaptic/hier/bg.png") repeat-x #DCDCDC;
}
#main {
margin: 0 auto;


}
#hauptbanner {
background:url("http://home.arcor.de/synaptic/hier/header_fhs.jpg");
width:1000px;
height: 250px;
margin:0 auto;
}
#content {
width:750px;
height: 750px;
margin-left: 25px;
overflow: scroll;
float: left;


}
#midsection {
margin-top: 25px;
margin-left:8px;


}
#status {
width: 100px;
margin-left: 25px;
float: left;
}
#sublinks {
width: 100px;
overflow:none;
}
#sublinks ul {
list-style:none;
margin-left:-10px;
}
#sublinks ul li a{
text-decoration:none;
}


div#navi {
width : 100%;
height : 25px;
border : 1px solid #999999;
background : #5d5d5d;
font : normal 90% Verdana;
margin-left:8px;
}
#navi a {
color : #999999;
text-decoration : none;
}
#navi a:hover, #navi a:focus {
color : #008000;
text-decoration : underline;


}
#navi ul{
list-style:none;
margin-top:3px;
}


#navi ul li{
display: inline;
padding-right:10px;
}


#footer {
width:1000px;
height: 75px;
margin-top: 25px;
}
#main{
width: 90%;
margin: 0 auto;
}
h1{
font-weight:600;
font-size:1.5em;
color:#000AAA;
text-align:center;
}


.clear{
clear:both;
}
</style>




<script type="text/javascript">
var hola = "Am Dienstag den 06.05.2008 um 20:31 eröffnete der User Alienx den Thread mit dem Titel: 'Mal was neues..o.O'
"+
		   "damit rief er ein kleines Fun-Projekt ins Leben, was unser Können im Bereich HTML, CSS, Javascript sowie Elemente des Webdesigns
"+
		   "von uns abverlangte....
Die Aufgabenstellung war folgende:"+
		   "


Ein User postet ein Stück (vollständigen) HTML-Code mit oder ohne sichtbaren Inhalt, das bleibt dem User selbst überlassen. Der User danach postet wiederum ein weiteres Stück ergänzenden HTML Code zu dem bereits bestehenden HTML-Fragment. Das ganze geht dann immer so weiter. Jetzt soll das ganze ja nicht nur einfach zu einer Ansammlung von zusammenhangslosem Codeabfall führen, am Ende soll dabei eine vollständ strukturierte HTML-Seite mit passenden Layout und Design entsehen. Bilder dürfen verwendet werden, ebenso JavaScript. Für Bilder gilt aber nach wie vor, das Urheberrecht zu beachten. CSS ist ebenfalls erlaubt, allerdings in dem Fall nur als Notation im Head oder inline-style-Element. </p>";


function schreibe(objekt, text){
document.getElementById(objekt).innerHTML = text;
}
</script>
</head>


<body>


<div id="main">


<div id="hauptbanner">
</div>


<div id="navi">


<ul>
    [*][url='index.html']Startseite[/url]
    [*][url='galerie.html']Galerie[/url]
    [*][url='about.html']About[/url]
    [*][url='kontakt.html']Kontaktformular[/url]
    [*][url='impressum.html']Impressum[/url]
[/list]
<noscript>Bitte aktivieren Sie Javascript, um eine volle Funktionalität dieser Website zu erreichen!!</noscript>
</div>


<div id="midsection"><h1>Das Forum-Hilfe.de Fun-Projekt</h1>
<div id="sublinks">
<ul>
  <!--  Deklariert im javascript einfach eine neue variable, die ihr mit inhalt füllt so wie die variable "hola"
  		diese variable muss außerhalb jeder funktion deklariert sein!!
		danach könnt ihr sie dann über die href eines links aufrufen (siehe unten)
		ich wollte hier jetzt nicht die links vorgeben, weil ich sonst eure kreativität zu sehr einschränken würde...
		aber es würde mich freuen, wenn ihr hier noch ein bisserl inhalt über links in diese liste hier unten 
		einpflegen würdet ;o) 
		also dann in diesem style: [*][url='javascript:schreibe('content', euer_variablenname);'][/url]
		mfg synaptic 
   -->
    [*][url='javascript:schreibe('content', hola);']Geschichtliches[/url]


[/list]
</div>


<div id="content">
</div>


<div id="status">
</div>
</div>


<div id="footer" class="clear">
[C] and Design by [url]www.forum-hilfe.de[/url]
</div>


</div>


</body>
</html>

Alles anzeigen

The User

HTML

<!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" 
xml:lang="de" lang="de"> 


<head> 
<META NAME="DC.Creator" CONTENT="Forum-Hilfe-User"> 
<META NAME="DC.Rights" CONTENT="© Alle Rechte liegen bei den Autoren"> 
<META NAME="DC.Description" CONTENT="Mal eine neue Seite, erstellt von Forum-Hilfe.de"> 
<META NAME="title" CONTENT="Mal etwas neues"> 
<META NAME="keywords" CONTENT="Mal was neues, Forum Hilfe,"> 




         <title>Mal was neues...o.O.</title> 

<style type="text/css"> 
body{ 
margin:0; 
padding:0; 
background: url("http://home.arcor.de/synaptic/hier/bg.png") repeat-x #DCDCDC; 
} 
#main { 
margin: 0 auto; 
width: 1000px;
} 
#hauptbanner { 
background:url("http://home.arcor.de/synaptic/hier/header_fhs.jpg"); 
width:1000px; 
height: 250px; 
margin:0 auto; 
} 
#content { 
width:750px; 
height: 750px; 
margin-left: 25px; 
overflow: auto; 
float: left; 
border: 2px solid green;
border-top: 0;
} 
#midsection { 
margin: 25px auto;
} 
#status { 
width: 100px; 
float: left; 
} 
#sublinks { 
width: 100px; 
overflow:none; 
margin-left: 8px;
float: left;
} 
#sublinks ul { 
list-style:none; 
padding: 0;
margin: 0;
} 
#sublinks ul li a{ 
text-decoration:none; 
} 


#navi { 
width : 1000px; 
height : 25px; 
border : 1px solid #999999; 
background : #5d5d5d; 
font : normal 90% Verdana; 
} 
#navi a { 
color : #999999; 
text-decoration : none; 
} 
#navi a:hover, #navi a:focus { 
color : #008000; 
text-decoration : underline; 


} 
#navi ul{ 
list-style:none; 
margin-top:3px; 
} 


#navi ul li{ 
display: inline; 
padding-right:10px; 
} 


#footer { 
width:1000px; 
height: 75px; 
margin-top: 25px; 
text-align: center;
} 
#main{
margin: 0 auto; 
} 
h1{ 
font-weight:600; 
font-size:1.5em; 
color:#000AAA; 
text-align:center; 
} 


.clear{ 
clear:both; 
} 
</style> 




<script type="text/javascript"> 
var hola = "Am Dienstag den 06.05.2008 um 20:31 eröffnete der User Alienx den Thread mit dem Titel: 'Mal was neues..o.O'
"+ 
         "damit rief er ein kleines Fun-Projekt ins Leben, was unser Können im Bereich HTML, CSS, Javascript sowie Elemente des Webdesigns
"+ 
         "von uns abverlangte....
Die Aufgabenstellung war folgende:"+ 
         "


Ein User postet ein Stück (vollständigen) HTML-Code mit oder ohne sichtbaren Inhalt, das bleibt dem User selbst überlassen. Der User danach postet wiederum ein weiteres Stück ergänzenden HTML Code zu dem bereits bestehenden HTML-Fragment. Das ganze geht dann immer so weiter. Jetzt soll das ganze ja nicht nur einfach zu einer Ansammlung von zusammenhangslosem Codeabfall führen, am Ende soll dabei eine vollständ strukturierte HTML-Seite mit passenden Layout und Design entsehen. Bilder dürfen verwendet werden, ebenso JavaScript. Für Bilder gilt aber nach wie vor, das Urheberrecht zu beachten. CSS ist ebenfalls erlaubt, allerdings in dem Fall nur als Notation im Head oder inline-style-Element. </p>"; 


function schreibe(objekt, text){ 
	document.getElementById(objekt).innerHTML = text; 
} 
</script> 
		</head> 


		<body> 


		<div id="main"> 


		<div id="hauptbanner"> 
		</div> 


		<div id="navi"> 


		<ul> 
		[*][url='index.html']Startseite[/url] 
		[*][url='galerie.html']Galerie[/url] 
		[*][url='about.html']About[/url] 
		[*][url='kontakt.html']Kontaktformular[/url] 
		[*][url='impressum.html']Impressum[/url] 
		[/list] 
		<noscript>Bitte aktivieren Sie Javascript, um eine volle Funktionalität dieser Website zu erreichen!!</noscript> 
		</div> 


		<div id="midsection"><h1>Das Forum-Hilfe.de Fun-Projekt</h1>
		<div id="sublinks"> 
		<ul> 
		<!--  Deklariert im javascript einfach eine neue variable, die ihr mit inhalt füllt so wie die variable "hola" 
		diese variable muss außerhalb jeder funktion deklariert sein!! 
		danach könnt ihr sie dann über die href eines links aufrufen (siehe unten) 
		ich wollte hier jetzt nicht die links vorgeben, weil ich sonst eure kreativität zu sehr einschränken würde... 
		aber es würde mich freuen, wenn ihr hier noch ein bisserl inhalt über links in diese liste hier unten 
		einpflegen würdet ;o) 
		also dann in diesem style: [*][url='javascript:schreibe('content', euer_variablenname);'][/url] 
		mfg synaptic 
		--> 
		[*][url='javascript:schreibe('content', hola);']Geschichtliches[/url] 


		[/list] 
		</div> 


		<div id="content"> 
		</div> 


		<div id="status"> 
		Du bist bei Forum-Hilfe
		</div> 
		</div> 


		<div id="footer" class="clear"> 
		[C] and Design by [url]www.forum-hilfe.de[/url] 
		</div> 


		</div> 


		</body> 
		</html>

Alles anzeigen

Überlegt euch mal was mitm border!

synaptic

ich dachte bstehendes darf nicht geändert werden?? also muss des overflow:scroll doch bleiben und darf net auto werden.. auch wenns besser aussieht oder irre ich da?
und sind jetzt alle demotiviert? spielen der user und ich alleine?
denn ich bin die nächsten tage in österreich und werd net online sein...
also seht ma zu daß aus diesem game hier noch wat wird:o)

sonst können der user und ich nämlich nen eigenes projekt aufziehen, was dann keine regeln hat sondern allein auf abspreache beruht...

traut euch, kaputt machen könnt ihr doch nix...

gelöschter User

HTML

<!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"
xml:lang="de" lang="de">


<head>
<META NAME="DC.Creator" CONTENT="Forum-Hilfe-User">
<META NAME="DC.Rights" CONTENT="© Alle Rechte liegen bei den Autoren">
<META NAME="DC.Description" CONTENT="Mal eine neue Seite, erstellt von Forum-Hilfe.de">
<META NAME="title" CONTENT="Mal etwas neues">
<META NAME="keywords" CONTENT="Mal was neues, Forum Hilfe,">




         <title>Mal was neues...o.O.</title>
 
<style type="text/css">
body{
margin:0;
padding:0;
background: url("http://home.arcor.de/synaptic/hier/bg.png") repeat-x #DCDCDC;
}
#main {
margin: 0 auto;
width: 1000px;
}
#hauptbanner {
background:url("http://home.arcor.de/synaptic/hier/header_fhs.jpg");
width:1000px;
height: 250px;
margin:0 auto;
}
#content {
width:750px;
height: 750px;
margin-left: 25px;
overflow: auto;
float: left;
border: 2px solid green;
border-top: 0;
}
#midsection {
margin: 25px auto;
}
#status {
width: 100px;
float: left;
}
#sublinks {
width: 100px;
overflow:none;
margin-left: 8px;
float: left;
}
#sublinks ul {
list-style:none;
padding: 0;
margin: 0;
}
#sublinks ul li a{
text-decoration:none;
}


#navi {
width : 1000px;
height : 25px;
border : 1px solid #999999;
background : #5d5d5d;
font : normal 90% Verdana;
}
#navi a {
color : #999999;
text-decoration : none;
}
#navi a:hover, #navi a:focus {
color : #008000;
text-decoration : underline;


}
#navi ul{
list-style:none;
margin-top:3px;
}


#navi ul li{
display: inline;
padding-right:10px;
}


#footer {
width:1000px;
height: 75px;
margin-top: 25px;
text-align: center;
}
#main{
margin: 0 auto;
}
h1{
font-weight:600;
font-size:1.5em;
color:#000AAA;
text-align:center;
}


.clear{
clear:both;
}
</style>




<script type="text/javascript">
var hola = "Am Dienstag den 06.05.2008 um 20:31 eröffnete der User Alienx den Thread mit dem Titel: 'Mal was neues..o.O'
"+
         "damit rief er ein kleines Fun-Projekt ins Leben, was unser Können im Bereich HTML, CSS, Javascript sowie Elemente des Webdesigns
"+
         "von uns abverlangte....
Die Aufgabenstellung war folgende:"+
         "


Ein User postet ein Stück (vollständigen) HTML-Code mit oder ohne sichtbaren Inhalt, das bleibt dem User selbst überlassen. Der User danach postet wiederum ein weiteres Stück ergänzenden HTML Code zu dem bereits bestehenden HTML-Fragment. Das ganze geht dann immer so weiter. Jetzt soll das ganze ja nicht nur einfach zu einer Ansammlung von zusammenhangslosem Codeabfall führen, am Ende soll dabei eine vollständ strukturierte HTML-Seite mit passenden Layout und Design entsehen. Bilder dürfen verwendet werden, ebenso JavaScript. Für Bilder gilt aber nach wie vor, das Urheberrecht zu beachten. CSS ist ebenfalls erlaubt, allerdings in dem Fall nur als Notation im Head oder inline-style-Element. </p>";


function schreibe(objekt, text){
   document.getElementById(objekt).innerHTML = text;
}
</script>
<script type="text/javascript">
var hola2 = "<fieldset>"+
		"<legend>Mitarbeiter</legend>"+
		"


synaptic</p>"+
		"


The User</p>"+
		"


Alienx</p>"+
                "


Sport Tipps</p>"+
		"


::RMB::</p>"+
		"


Josi</p>"+
	"</fieldset>"
;


function schreibe(objekt, text){
   document.getElementById(objekt).innerHTML = text;
}
</script>
      </head>


      <body>


      <div id="main">


      <div id="hauptbanner">
      </div>


      <div id="navi">


      <ul>
      [*][url='index.html']Startseite[/url]
      [*][url='galerie.html']Galerie[/url]
      [*][url='about.html']About[/url]
      [*][url='kontakt.html']Kontaktformular[/url]
      [*][url='impressum.html']Impressum[/url]
      [/list]
      <noscript>Bitte aktivieren Sie Javascript, um eine volle Funktionalität dieser Website zu erreichen!!!</noscript>
      </div>


      <div id="midsection"><h1>Das Forum-Hilfe.de Fun-Projekt</h1>
      <div id="sublinks">
      <ul>
      <!--  Deklariert im javascript einfach eine neue variable, die ihr mit inhalt füllt so wie die variable "hola"
      diese variable muss außerhalb jeder funktion deklariert sein!!
      danach könnt ihr sie dann über die href eines links aufrufen (siehe unten)
      ich wollte hier jetzt nicht die links vorgeben, weil ich sonst eure kreativität zu sehr einschränken würde...
      aber es würde mich freuen, wenn ihr hier noch ein bisserl inhalt über links in diese liste hier unten
      einpflegen würdet ;o)
      also dann in diesem style: [*][url='javascript:schreibe('content', euer_variablenname);'][/url]
      mfg synaptic
      -->
      [*][url='javascript:schreibe('content', hola);']Geschichtliches[/url]
      [*][url='javascript:schreibe('content', hola2);']Mitarbeiter[/url]
 
      [/list]
      </div>


      <div id="content">
      </div>


      <div id="status">
      Du bist bei Forum-Hilfe
      </div>
      </div>


      <div id="footer" class="clear">
      [C] and Design by [url]www.forum-hilfe.de[/url]
      </div>


      </div>


      </body>
      </html>

Alles anzeigen

Ich hoffe ich hab das mit dem Javascript richtig gemacht!
Aber es müsste gehen
Wie wärs wenn wir den Mouseover nochmal ändern?
Also der oben zu dem Grün... das kann man sehr schlecht lesen!

mfg

synaptic

mit dem javascript haste es net ganz richtig gemacht, du hast nen neues geschrieben und die funktion nochmal geschrieben.. hättest lediglich die variable deklarieren und dann im link das ganze aufrufen müssen...
habs mal berichtigt ohne daß die ganze sache beschädigt wurde.
hab nur ein klein wenig content geändert und styles, dmait auch mal andere hier zum zug kommen.

HTML

<!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"
xml:lang="de" lang="de">


<head>
<META NAME="DC.Creator" CONTENT="Forum-Hilfe-User">
<META NAME="DC.Rights" CONTENT="© Alle Rechte liegen bei den Autoren">
<META NAME="DC.Description" CONTENT="Mal eine neue Seite, erstellt von Forum-Hilfe.de">
<META NAME="title" CONTENT="Mal etwas neues">
<META NAME="keywords" CONTENT="Mal was neues, Forum Hilfe,">




         <title>Mal was neues...o.O.</title>
 
<style type="text/css">
body{
margin:0;
padding:0;
background: url("http://home.arcor.de/synaptic/hier/bg.png") repeat-x #DCDCDC;
}
#main {
margin: 0 auto;
width: 1000px;
}
#hauptbanner {
background:url("http://home.arcor.de/synaptic/hier/header_fhs.jpg");
width:1000px;
height: 250px;
margin:0 auto;
}
#content {
width:750px;
height: 750px;
margin-left: 25px;
padding:0 10px;
overflow: auto;
float: left;
border: 2px solid green;
border-top: 0;
}
#midsection {
margin: 25px auto;
}
#status {
width: 100px;
float: left;
}
#sublinks {
width: 100px;
overflow:none;
margin-left: 8px;
float: left;
}
#sublinks ul {
list-style:none;
padding: 0;
margin: 0;
}
#sublinks ul li a{
text-decoration:none;
}


#navi {
width : 1000px;
height : 25px;
border : 1px solid #999999;
background : #5d5d5d;
font : normal 90% Verdana;
}
#navi a {
color : #999999;
text-decoration : none;
}
#navi a:hover, #navi a:focus {
color : #008000;
text-decoration : underline;


}
#navi ul{
list-style:none;
margin-top:3px;
}


#navi ul li{
display: inline;
padding-right:10px;
}


#footer {
width:1000px;
height: 75px;
margin-top: 25px;
text-align: center;
}
#main{
margin: 0 auto;
}
h1{
font-weight:600;
font-size:1.5em;
color:#000AAA;
text-align:center;
}
fieldset{
padding:10px;
}
.clear{
clear:both;
}
</style>




<script type="text/javascript">
var hola = "Am Dienstag den 06.05.2008 um 20:31 eröffnete der User Alienx den Thread mit dem Titel: 'Mal was neues..o.O'
"+
         "damit rief er ein kleines Fun-Projekt ins Leben, was unser Können im Bereich HTML, CSS, Javascript sowie Elemente des Webdesigns
"+
         "von uns abverlangte....
Die Aufgabenstellung war folgende:"+
         "


Ein User postet ein Stück (vollständigen) HTML-Code mit oder ohne sichtbaren Inhalt, das bleibt dem User selbst überlassen. Der User danach postet wiederum ein weiteres Stück ergänzenden HTML Code zu dem bereits bestehenden HTML-Fragment. Das ganze geht dann immer so weiter. Jetzt soll das ganze ja nicht nur einfach zu einer Ansammlung von zusammenhangslosem Codeabfall führen, am Ende soll dabei eine vollständ strukturierte HTML-Seite mit passenden Layout und Design entsehen. Bilder dürfen verwendet werden, ebenso JavaScript. Für Bilder gilt aber nach wie vor, das Urheberrecht zu beachten. CSS ist ebenfalls erlaubt, allerdings in dem Fall nur als Notation im Head oder inline-style-Element. </p>";


		 
var hola2 = "<fieldset>"+
      	  	"<legend>Mitarbeiter</legend>"+
    		"


synaptic</p>"+
      		"


The User</p>"+
      		"


Alienx</p>"+
      		"


Sport Tipps</p>"+
      		"


::RMB::</p>"+
      		"


Josi</p>"+
      		"</fieldset>";

//var 

function schreibe(objekt, text){
   document.getElementById(objekt).innerHTML = text;
}


</script>
      </head>


      <body>


      <div id="main">


      <div id="hauptbanner">
      </div>


      <div id="navi">


      <ul>
      [*][url='index.html']Startseite[/url]
      [*][url='galerie.html']Galerie[/url]
      [*][url='about.html']About[/url]
      [*][url='kontakt.html']Kontaktformular[/url]
      [*][url='impressum.html']Impressum[/url]
      [/list]
      <noscript>Bitte aktivieren Sie Javascript, um eine volle Funktionalität dieser Website zu erreichen!!!</noscript>
      </div>


      <div id="midsection"><h1>Das Forum-Hilfe.de Fun-Projekt</h1>
      <div id="sublinks">
      <ul>
      <!--  Deklariert im javascript einfach eine neue variable, die ihr mit inhalt füllt so wie die variable "hola"
      diese variable muss außerhalb jeder funktion deklariert sein!!
      danach könnt ihr sie dann über die href eines links aufrufen (siehe unten)
      ich wollte hier jetzt nicht die links vorgeben, weil ich sonst eure kreativität zu sehr einschränken würde...
      aber es würde mich freuen, wenn ihr hier noch ein bisserl inhalt über links in diese liste hier unten
      einpflegen würdet ;o)
      also dann in diesem style: [*][url='javascript:schreibe('content', euer_variablenname);'][/url]
      mfg synaptic
      -->
      [*][url='javascript:schreibe('content', hola);']Geschichtliches[/url]
      [*][url='javascript:schreibe('content', hola2);']Mitarbeiter[/url]
 
      [/list]
      </div>


      <div id="content">
	  Das hier ist das Forum-hilfe.de-Fun-Projekt


	  Über die Navigation links findet Ihr alle Informationen, wie dieses Projekt entstanden ist.


	  Viel Spass beim stöbern ;o)
      </div>


      <div id="status">
      Du bist bei Forum-Hilfe
      </div>
      </div>


      <div id="footer" class="clear">
      [C] and Design by [url]www.forum-hilfe.de[/url]
      </div>


      </div>


      </body>
      </html>

Alles anzeigen

find das spiel an sich recht gut, nur schade, daß es so wenig anklang findet!!!

Tags