Naar beneden scrollen - Forum

- Ariën -

10-06-2014 21:37

Kan je dit tussen [code] en [/code] -tags plaatsen, zoals ik net vroeg? Dat maakt de boel beter leesbaarder.

Matthijs P

10-06-2014 21:38

<!DOCTYPE>
<html>
<head>
<title>Matthijs</title>
<link rel="stylesheet" type="text/css" href="main.css">
<link rel="stylesheet" type="text/css" href="styles.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/JavaScript">

is trouwens de header de andere was verkeerd

- Ariën -

10-06-2014 21:40 gewijzigd op 10-06-2014 21:41

Beste Mathijs,

De code-tags zijn bedoeld om je scripts op het forum in een leesbaar wit vlak te plaatsen met regelnummering erbij.
Ik zou het op prijs stellen dat je deze tags voortaan om script in het forum heen plaatst.

Gebruik deze tags om je script heen, als je ze op het forum plaatst, en alles wordt duidelijker leesbaarder. je kan je bestaande berichten aanpassen door op

te klikken.

M

Matthijs P

10-06-2014 21:52

oh sorry ik dacht dat je het over het script zelf had.
Mijn exucces daarvoor

 
<!DOCTYPE> 
<html>
<head>
<title>Matthijs</title>
<link rel="stylesheet" type="text/css" href="main.css">
<link rel="stylesheet" type="text/css" href="styles.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/JavaScript">

$(document).ready(function() {

$('a#portfolio').click(function(){
pHeight = $("div.portfolioindex").height();
$('div.container').animate({scrollTop: pHeight}, 2500);
return false;

}); 
});

</script> 

<header class="menu">
<div id='cssmenu'>
<ul>
<li class='active'><a href='index.html'><span>Home</span></a></li>
<li class='has-sub' id="bottom"><a href='#'><span>Portfolio</span></a></li>
<li><a href='' onclick="overmij"><span>Over mij</span></a></li>
<li><a href='' onclick="downloads"><span>downloads</span></a></li>
<li class='last'><a href='#'><span>Contact</span></a></li>
</ul>
</div>
</header>
</div>
<body>
<div class="container">
<div class="top" id="midden">
<h1 class="wit ">Hiya!</h1>
<p class="ondertitel">Welkom op mijn site!</p>
<a href=""><img id="mac" src="images/mac.png" width="600" height="300"></a>
</div>

<div idclass="portfolioindex" id="midden">
<br/>

<h1 class="algemeen">Portfolio</h1>
<p class="ondertitel">Lees en bekijk hier al mijn projecten!</p>
</div>



<div id="box1"> 
<div id="overlay1">
<span id="plus"><a href="portfolio/"><img src="images/hover.png" width="130" height="135"></a></span>
</div>
</div>

<div id="box2"> 
<div id="overlay2">
<span id="plus"><a href="portfolio/"><img src="images/hover.png" width="130" height="135"></a></span>
</div>
</div>

<div id="box3"> 
<div id="overlay3">
<span id="plus"><a href="portfolio/"><img src="images/hover.png" width="130" height="135"></a></span>
</div>
</div>
</div>



<div class="Overmij">
<h1 class="wit" id="midden">Over mij</h1>
<p class="ondertitel" id="midden">Kom hier meer over mij te weten!</p>

<div class="">
</div>
<br/>
<br/>



<div class="tekstovermij">

<p class="wit">


</div>
</div>
</div> 

</body>
</html>

hopelijk is dit beter

Joakim Broden

10-06-2014 21:58 gewijzigd op 10-06-2014 22:02

<div idclass="portfolioindex" id="midden">

idclass bestaat niet, dit moet class zijn.

Tevens je HTML is echt belabberd, ga eens even goed HTML leren ;-)

- Je sluit veel element niet af.
- Ene keer gebruik je ' en andere keer "
- header hoort in de body
- id's gebruik je dubbel, mag maar 1 keer voor komen per pagina
- volgens mij veel overbodige elementen en classes
- ene keer nederlandse class namen andere keer weer engels

pHeight = $("div.portfolioindex").height();
$('div.container').animate({scrollTop: pHeight}, 2500);

gaat sowieso verkeerd. Je wilt dat hij scrollt naar de hoogte van het element? Ik denk eerder naar de position van het element.

$("div.portfolioindex").position().top; komt meer in de buurt

Zo kan ik nog wel even door gaan. Fix je HTML om fouten te voorkomen

O

Obelix Idefix

10-06-2014 22:00 gewijzigd op 10-06-2014 22:01

Matthijs P op 10/06/2014 21:52:19
 
<div idclass="portfolioindex" id="midden">

Klopt dat idclass?

Verder een tip: spring je code in, zodat je bv. kunt zien welke <div> bij </div> hoort.

Verder kan er toch maar 1x een id op een pagina voorkomen? Zie meerdere keren id="midden" staan.

- Ariën -

10-06-2014 22:01

Je HTML is niet correct opgebouwd. Ik zie zomaar halverwege ergens een <body>-tag voorbijkomen, de code is niet uitgelijnd met TAB, en ik zie een </div>-tag teveel.

Zorg eerst dat je HTML-code gewoon valid is.

M

Matthijs P

11-06-2014 14:13

het meeste komt omdat ik somige dingen heb weg gehaald die ik liever niet op dit forum plaats

Eschwin Moerkerken

11-06-2014 15:35 gewijzigd op 11-06-2014 15:43

Ik laat je een klein voorbeeldje zien hoe je code netjes hoort te indenten:


<header class="menu">
  <div id='cssmenu'>
    <ul>
      <li class='active'><a href='index.html'><span>Home</span></a></li>
      <li class='has-sub' id="bottom"><a href='#'><span>Portfolio</span></a></li>
      <li><a href='' onclick="overmij"><span>Over mij</span></a></li>
      <li><a href='' onclick="downloads"><span>downloads</span></a></li>
      <li class='last'><a href='#'><span>Contact</span></a></li>
    </ul>
  </div>
</header>

<body>
  <div class="container">
    <div class="top" id="midden">
      <h1 class="wit">Hiya!</h1>
      <p class="ondertitel">Welkom op mijn site!</p>
      <a href=""><img id="mac" src="images/mac.png" width="600" height="300"></a>
    </div>
  </div>
</body>

Daarnaast heb ik een vraag, waarom gebruik je een <span> element binnen een anchor <a> element ? Je kan hem ook weg laten en er een display:inline-block; aan meegeven (aan de anchor) in de css.

Verder is je html niet helemaal zoals het hoort maar oefening baart kunst en zo ben ik ook begonnen een aantal jaar geleden, wat helemaal niet erg is!

Je javascript klopt ook niet helemaal bovenaan, je sluit ze niet goed af en dergelijke, ik heb helaas geen tijd om al je code te verbeteren, sorry.

Zoek eens een aantal voorbeelden op van w3schools of kijk her en der eens in de broncode als je op een website komt waarvan je vind dat die er interessant uit ziet. Daarbij moet je wel op letten dat sommige websites automatisch worden aangevuld door opensource CMS systemen en de broncode er dan niet echt bepaald netjes uit ziet!

Heel veel succes ermee !

M

Matthijs P

11-06-2014 16:29

Mijn html script hoeft niet geordend te zijn als hij het maar doet vind ik zelf :D