Cursus website maken

coderunner · 13 nov 2008, 14:18

sadira schreef:je bent hartstikke bedenkt het is gelukt

Beste sadira,

Dat is graag gedaan en ik ben blij dat het je gelukt is.
Bedankt om dit hier te melden

Nog veel plezier met je website.

mvg,
Coderunner

audry · 13 nov 2008, 18:03

hier ben ik al terug met een ander probleem, mijn eerste pagina is gemaakt maar , alles staat een beetje te hoog , Hoe kan ik alles een beetje verlagen , dit vind ik niet in de cursus;
Mischien kijk ik er wel over.

MVG A.

coderunner · 13 nov 2008, 19:21

audry schreef:hier ben ik al terug met een ander probleem, mijn eerste pagina is gemaakt maar , alles staat een beetje te hoog , Hoe kan ik alles een beetje verlagen , dit vind ik niet in de cursus;
Mischien kijk ik er wel over.

Beste audry,

Dan zal je wel je html code van de pagina hier moeten plaatsen want dat kan aan vanalles liggen.

mvg,
Coderunner

audry · 13 nov 2008, 19:25

<html>
<head>
</head>
<body>
<title>WTC centrum sportief vzw</title>
<h1 align="center"><font color="#3300FF">Welkom op de website van WTC centrum sportief vzw<font></h1>
<marquee><font size="5">Sponsor Depa Ramen Eeklo</font></marquee>
<marquee><font size="5">Clublokaal Sparrenhof</font></marquee>
<body background="grijs_42.jpg">
<script language="JavaScript1.2">
var mydate=new Date()
var year=mydate.getYear()
if(year<2000)
year="19"+year
var day=mydate.getDay()
var daym=mydate.getDate()
var month=mydate.getMonth()
if(daym<10)
daym="0"+daym
var dayarray=new Array("Zondag","Maandag","Dinsdag","Woensdag","Donderdag","Vrijdag","Zaterdag")
var montharray=new Array("Januari","Februari","Maart","April","Mei","Juni","Juli","Augustus","September","Oktober","November","December")
document.write("<font color='00003c' face='Veranda' size=4>"+dayarray[day]+", "+montharray[month]+" "+daym+", "+year+"</font>")
</script>
<table width="80%" cellpadding="2" celspacing="2" align="center">
<tr>
<td><a href="WTC centrum sportief vzw.html"><font size="10" font color="#00003C">Home</font></A></td>
<td><a href="WTC centrum sportief vzw..html"><font size="10" font color="#00003C">Bestuur</font></A></td>
<td><a href="WTC centrum sportief vzw..html"><font size="10" font color="#00003C">Leden</font></a></td>
</tr>
<script language="JavaScript">
fCol='0000FF'; //face colour.
sCol='FF00FF'; //seconds colour.
mCol='0000FF'; //minutes colour.
hCol='000000'; //hours colour.
Ybase=25; //Clock height.
Xbase=25; //Clock width.
H='...';
H=H.split('');
M='....';
M=M.split('');
S='.....';
S=S.split('');
NS4=(document.layers);
NS6=(document.getElementById&&!document.all);
IE4=(document.all);
Ypos=0;
Xpos=0;
dots=12;
Split=360/dots;
if (NS6){
for (i=1; i < dots+1; i++){
document.write('<div id="n6Digits'+i+'" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial;font-size:10px;color:#'+fCol+';text-align:center;padding-top:10px">'+i+'</div>');
}
for (i=0; i < M.length; i++){
document.write('<div id="Ny'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+mCol+'"></div>');
}
for (i=0; i < H.length; i++){
document.write('<div id="Nz'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+hCol+'"></div>');
}
for (i=0; i < S.length; i++){
document.write('<div id="Nx'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+sCol+'"></div>');
}
}
if (NS4){
dgts='1 2 3 4 5 6 7 8 9 10 11 12';
dgts=dgts.split(' ')
for (i=0; i < dots; i++){
document.write('<layer name=nsDigits'+i+' top=0 left=0 height=30 width=30><center><font face=Arial size=1 color='+fCol+'>'+dgts+'</font></center></layer>');
}
for (i=0; i < M.length; i++){
document.write('<layer name=ny'+i+' top=0 left=0 bgcolor='+mCol+' clip="0,0,2,2"></layer>');
}
for (i=0; i < H.length; i++){
document.write('<layer name=nz'+i+' top=0 left=0 bgcolor='+hCol+' clip="0,0,2,2"></layer>');
}
for (i=0; i < S.length; i++){
document.write('<layer name=nx'+i+' top=0 left=0 bgcolor='+sCol+' clip="0,0,2,2"></layer>');
}
}
if (IE4){
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=1; i < dots+1; i++){
document.write('<div id="ieDigits" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial;font-size:10px;color:'+fCol+';text-align:center;padding-top:10px">'+i+'</div>');
}
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < M.length; i++){
document.write('<div id=y style="position:absolute;width:2px;height:2px;font-size:2px;background:'+mCol+'"></div>');
}
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < H.length; i++){
document.write('<div id=z style="position:absolute;width:2px;height:2px;font-size:2px;background:'+hCol+'"></div>');
}
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < S.length; i++){
document.write('<div id=x style="position:absolute;width:2px;height:2px;font-size:2px;background:'+sCol+'"></div>');
}
document.write('</div></div>')
}
function clock(){
time = new Date ();
secs = time.getSeconds();
sec = -1.57 + Math.PI * secs/30;
mins = time.getMinutes();
min = -1.57 + Math.PI * mins/30;
hr = time.getHours();
hrs = -1.57 + Math.PI * hr/6 + Math.PI*parseInt(time.getMinutes())/360;
if (NS6){
Ypos=window.pageYOffset+window.innerHeight-Ybase-25;
Xpos=window.pageXOffset+window.innerWidth-Xbase-30;
for (i=1; i < dots+1; i++){
document.getElementById("n6Digits"+i).style.top=Ypos-15+Ybase*Math.sin(-1.56 +i *Split*Math.PI/180)
document.getElementById("n6Digits"+i).style.left=Xpos-15+Xbase*Math.cos(-1.56 +i*Split*Math.PI/180)
}
for (i=0; i < S.length; i++){
document.getElementById("Nx"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(sec);
document.getElementById("Nx"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(sec);
}
for (i=0; i < M.length; i++){
document.getElementById("Ny"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(min);
document.getElementById("Ny"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(min);
}
for (i=0; i < H.length; i++){
document.getElementById("Nz"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(hrs);
document.getElementById("Nz"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(hrs);
}
}
if (NS4){
Ypos=window.pageYOffset+window.innerHeight-Ybase-20;
Xpos=window.pageXOffset+window.innerWidth-Xbase-30;
for (i=0; i < dots; ++i){
document.layers["nsDigits"+i].top=Ypos-5+Ybase*Math.sin(-1.045 +i*Split*Math.PI/180)
document.layers["nsDigits"+i].left=Xpos-15+Xbase*Math.cos(-1.045 +i*Split*Math.PI/180)
}
for (i=0; i < S.length; i++){
document.layers["nx"+i].top=Ypos+i*Ybase/4.1*Math.sin(sec);
document.layers["nx"+i].left=Xpos+i*Xbase/4.1*Math.cos(sec);
}
for (i=0; i < M.length; i++){
document.layers["ny"+i].top=Ypos+i*Ybase/4.1*Math.sin(min);
document.layers["ny"+i].left=Xpos+i*Xbase/4.1*Math.cos(min);
}
for (i=0; i < H.length; i++){
document.layers["nz"+i].top=Ypos+i*Ybase/4.1*Math.sin(hrs);
document.layers["nz"+i].left=Xpos+i*Xbase/4.1*Math.cos(hrs);
}
}

if (IE4){
Ypos=document.body.scrollTop+window.document.body.clientHeight-Ybase-20;
Xpos=document.body.scrollLeft+window.document.body.clientWidth-Xbase-20;
for (i=0; i < dots; ++i){
ieDigits.style.pixelTop=Ypos-15+Ybase*Math.sin(-1.045 +i *Split*Math.PI/180)
ieDigits.style.pixelLeft=Xpos-15+Xbase*Math.cos(-1.045 +i *Split*Math.PI/180)
}
for (i=0; i < S.length; i++){
x.style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(sec);
x.style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(sec);
}
for (i=0; i < M.length; i++){
y.style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(min);
y.style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(min);
}
for (i=0; i < H.length; i++){
z.style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(hrs);
z.style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(hrs);
}
}
setTimeout('clock()',100);
}
clock();
//-->
</script>

<p align="center"><img src="images/EersteritDepa2008012.jpg" width="425" height="227"></p>

</body>
</html>

audry · 13 nov 2008, 19:31

dit is de code van de eerste pagina ,maar bij bestuur zou ik een link willen met een andere pagina . Moet ik dan terug hetzelde doen als de eerste ?

coderunner · 13 nov 2008, 19:48

Beste audry,

Voor het lager brengen van de top van de pagina plaats je volgende code tussen <head> en </head>

Code: Selecteer alles

<style type="text/css">
body {
margin-top: 80px;
}
</style>

De waarde (hier 80px) kan je naar eigen smaak wijzigen. Hoe groter het getal hoe groter de ruimte tussen top en tekst.

Wil je in de tekst meer ruimte creeeren tussen onderwerpen dan gebruik je ofwel

Code: Selecteer alles

<br>

of

Code: Selecteer alles

<p>&nbsp;</p>

en dit zoveel keer tot de ruimte goed is.

mvg,
Coderunner

coderunner · 13 nov 2008, 20:08

audry schreef:... maar bij bestuur zou ik een link willen met een andere pagina . Moet ik dan terug hetzelde doen als de eerste ?

Beste audry,

Een fout die vele beginners maken zijn de spaties in bestandsnamen van pagina's, foto's afbeeldingen, enz...
voorbeeld uit je paina

<td><a href="WTC centrum sportief vzw.html"><font size="10" color="#00003C">Home</font></A></td>

In de bestandsnaam staan spaties tussen elk woord.

Wijzig dit in
1- ofwel

<td><a href="WTC_centrum_sportief_vzw.html"><font size="10" color="#00003C">Home</font></A></td>

Spaties zijn vervangen door "_" (underscores)

2- ofwel

<td><a href="WTCCentrumSportiefVzw.html"><font size="10" color="#00003C">Home</font></A></td>

Spaties werden verwijderd en de bestandsnaam werd aan elkaar geschreven waarin elk woord begint met een hoofdletter om het iets leesbaarder te maken

Denk er dan ook aan dat je van de eigenlijke aangemaakte html pagina's de bestandsnaam ook wijzigt.

Nu wil je een link naar bestuur maken dan vul je achter <a href=...> de naam van de htm pagina in waarnaar je wil linken. bv. de aangemaakte pagina heb je "bestuur.html" genoemd dan wordt dit

<td><a href="bestuur.html"><font size="10" color="#00003C">Bestuur</font></A></td>

mvg,
Coderunner

Aanpassing: fout in code verbeterd

audry · 13 nov 2008, 21:01

Bedankt voor mij te helpen ik ga dit nu uitproberen , maar deze code's staan toch niet in de cursus?

Groetjes A.

coderunner · 13 nov 2008, 21:29

audry schreef:Bedankt voor mij te helpen ik ga dit nu uitproberen , maar deze code's staan toch niet in de cursus?

Beste audry,

Dat is graag gedaan en neen deze codes staan er niet in en nog duizende andere codes. Daarom is het een "beginners"cursus

anders zouden die door het bos, de bomen niet meer zien.

Veel succes en houd me op de hoogte met je vorderingen.

mvg,
Coderunner

audry · 15 nov 2008, 19:38

Hier terug een probleempje, dit is een oefen website.Daar probeer ik een beetje vanalles,nu lukt het niet om de link te leggen naar bestuur, hij vind de pagina niet ; Wat doe ik verkeerd ?Ik heb voor alle zekerheid de code's erbij gezet.Bij de fotoalbum was dat geen probleem.
De eerste code's zijn van de tseede pagina.

<html>
<head>
<title>Website_WTC_centrum_sportief/bestuur</title>
<br>
<br>
<br>
</head>
<body bgcolor="#99CCFF"text="#00003C">
<h1 align="center"><font color="#00003C">Bestuur<font></h1>
</body>
</html>

<html>
<head>
<title>Website_WTC_centrum_sportief</title>
<br>
<br>
<br>
</head/>
<body bgcolor="#99CCFF"text="#00003C">
<h1 align="center"><font color="#00003C">Welkom op de website van WTC centrum sportief<font></h1>
<marquee><font size="5">Sponsors Depa Ramen</font></marquee>
<marquee><font size="5">Clublokaal Sparrenhof</font></marquee>
<br>
<p align="center"><img src="afbeeldingen/EersteritDepa2008012.jpg" width="425" height="227"></p>
<br>
<table width="50%"border="3"bordercolor="#00003c"align="center">
<tr>
<td align="center"rowspan="3"><b><a href="ebsite_WTC_centrum_sportief.html"><font size="10" color="#00003C">Bestuur</font></A></td>
<td align="center"><b>Kalender</td>
</tr>
<tr>
<td align="center"><b>Organisaties</td>
</tr>
<tr>
<td align="center"><b><a href="http://picasaweb.google.com/home">Fotoalbum</a></4td>
</tr>
<tr>
<td align="center"><b>Clubleden</td>
<td>Cel 6</td>
</tr>
</table>

coderunner · 15 nov 2008, 22:01

Beste audry,

<html>
<head>
<title>Website_WTC_centrum_sportief</title>
<br>
<br>
<br>
</head/>
<body bgcolor="#99CCFF"text="#00003C">
<h1 align="center"><font color="#00003C">Welkom op de website van WTC centrum sportief<font></h1>
<marquee><font size="5">Sponsors Depa Ramen</font></marquee>
<marquee><font size="5">Clublokaal Sparrenhof</font></marquee>
<br>
<p align="center"><img src="afbeeldingen/EersteritDepa2008012.jpg" width="425" height="227"></p>
<br>
<table width="50%"border="3"bordercolor="#00003c"align="center">
<tr>
<td align="center"rowspan="3"><b><a href="Website_WTC_centrum_sportief.html"><font size="10" color="#00003C">Bestuur</font></A></td>
<td align="center"><b>Kalender</td>
</tr>
<tr>
<td align="center"><b>Organisaties</td>
</tr>
<tr>
<td align="center"><b><a href="http://picasaweb.google.com/home">Fotoalbum</a></4td>
</tr>
<tr>
<td align="center"><b>Clubleden</td>
<td>Cel 6</td>
</tr>
</table>

Je bent de bestandsnaam van de pagina "Bestuur" vergeten mee te geven maar me bazerend op de benaming van andere pagina's denk ik dat je in de code de link naar de pagina de W vergeten bent.

Anders moet je de benaming van de pagina waarin je "Bestuur" hebt opgeslagen eens doorgeven.

mvg,
Coderunner

audry · 15 nov 2008, 22:11

Bedankt voor op een zaterdagavond te antwoorden,
Ik heb in mijn documenten een map- Website WTC met daarin submappen -afbeeldingen -javascripts-pages
en in pages staat indexwtc en Bestuur
en toch vint hij de pagina niet???

coderunner · 15 nov 2008, 22:21

Beste audry,

Ik veronderstel dat je index.html waarop de link staan in dezelfde map staat als deze van "Bestuur" of is dit niet zo ?
Welke naam heb je de pagina over het "bestuur" gegeven ? Heb je de pagina "Website_WTC_centrum_sportief.html" genoemd ?

Staat je site online ?

mvg,
Coderunner

audry · 15 nov 2008, 22:28

mijn site staat nog niet online , ik dacht dat je dit op het laatst maar mag doen.
ik heb gewoon de pagina bestuur genoemd.

audry · 15 nov 2008, 22:29

iets vergeten index.htm staat in dezelfde map als bestuur.