abonnement Unibet Coolblue Bitvavo
pi_131060715
[html, css, js] Voor Dummies

Dit topic is bedoeld voor alle vragen m.b.t. HTML, CSS en javascript, kortom alles wat je nodig hebt om (de frontend van) een website te maken.

HTML: Hyper Text Markup Language is de structuur van een website. Door middel van verschillende html tags geef je aan welke elementen bij elkaar horen (bijv: <div>, <ul>), of wat de betekenis van deze data is (bijv. <p>, <h1>). HTML leent zich ook voor opmaak, maar het is makkelijker en verstandiger om hier CSS voor te gebruiken.
CSS: Cascading StyleSheet is de opmaak van een website. In je CSS specificeer je bijvoorbeeld welke kleur bepaalde elementen moeten hebben, hoe groot ze zijn en hoe je ze wilt rangschikken.
JS: Javascript Javascript (niet te verwarren met programmeertaal Java) is een scripttaal, waarmee het mogelijk is je website dynamisch te maken. Javascript kan bijvoorbeeld HTML-elementen aanpassen, toevoegen of verwijderen. Omdat javascript zeer veelzijdig is, is er voor specifieke JS vragen ook een specaal topic, zie: [Javascript] voor dummies

Vragen over PHP, SQL of andere serverside programmeertalen horen niet in dit topic. Stel deze in [PHP/MySQL] voor dummies of open zelf een topic.
Voor vragen over webhosting, domeinnamen enz. is ook een ander topic: Het grote (betaalde) webhosting topic
En voor Wordpress is er ook een speciaal topic, als het om meer gaat dan de HTML/CSS van een theme: Topicreeks: Algemeen Wordpress topic

Code posten
Het is, als je een vraag stelt, vaak handig om hier een stukje code bij te voegen. Post niet klakkeloos je hele website, maar post alleen het stukje code waar je vraag over gaat. Gebruik bovendien de [code]-tag (code.png), zodat je HTML, CSS of Javascript code goed leesbaar is. Dus niet [quote] of [spoiler] of wat dan ook.

Veel voorkomende problemen
Veel problemen zijn te wijden aan het niet kloppen van HTML of CSS code. Een kleine typfout is snel gemaakt, en de webbrowser kan daar soms erg slecht mee omgaan. Om te controleren of je code technisch in orde is, kun je deze controleren met de W3 validator.
Is je code niet correct? Los dan eerst de fouten op zodat de validator geen foutmeldingen meer geeft. Dit lost niet altijd je probleem op, maar zorgt in ieder geval dat alles werkt zoals het hoort te werken, waardoor overige fouten ook veel makkelijker te achterhalen zijn.

IK SNAP ER NIETS VAN HELLEP! WAT IS CSS?
We helpen iedereen graag in dit topic, ook mensen die er helemaal niets van begrijpen. Maar we verwachten wel dat je je best doet om het wel te gaan begrijpen. Lees eens wat tutorials en probeer het altijd eerst zelf. Je krijgt hier tips waar je zelf iets mee moet doen.

Voor je een vraag stel hier, verplichte kost
http://www.alistapart.com/articles/css-floats-101/
http://www.alistapart.com/articles/css-positioning-101/
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_131060788
Het moet #36 zijn..
Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.
pi_131060888
quote:
3s.gif Op woensdag 11 september 2013 15:36 schreef Maringo het volgende:
Het moet #36 zijn..
Klopt. TR Gemacht.
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
  woensdag 11 september 2013 @ 15:42:44 #4
63192 ursel
"Het Is Hier Fantastisch!
pi_131061016
quote:
11s.gif Op woensdag 11 september 2013 15:39 schreef Catch22- het volgende:

[..]

Klopt. TR Gemacht.
quote:
Think before you act
:')
pi_131061046
quote:
11s.gif Op woensdag 11 september 2013 15:34 schreef Catch22- het volgende:
ik pleur er vrijwel _altijd_ een anti-cache parameter bij in
Ik zorg gewoon voor no-cache headers bij JSON requests.
quote:
0s.gif Op woensdag 11 september 2013 15:09 schreef Skunk-m het volgende:
weet niet hoe dat werkt dat JSON.. en jquery dan snap ik er helemaal niks meer van.

JSON en jQuery zijn toch wel de moeite waard hoor. Zou je script er (enigszins vereenvoudigd) ongeveer zo uitzien:
1
2
3
4
5
6
7
function newmess(){
  $.getJSON("shout/getshouts.php",{'id': id}, function(data){
    $("#hoelang").html(data.hoelang);
    $("#shout").prepend(data.shout);
    setTimeout(newmess,1000);
  });
}
pi_131061139
quote:
0s.gif Op woensdag 11 september 2013 15:42 schreef ursel het volgende:

[..]


[..]

:')
do as I say, not as I do.

Ik vertrouw die headers niet :P
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_131068815
Ik zit hier de hele tijd te kloten omdat ik denk twerkt nog niet met random meuk in die string..

Ie heeft een belachelijke omweg nog schijnbaar.. omdat IE weigert die zooi opnieuw te laden ofzo
nu heb ik dit ervan moeten maken.

shout.innerHTML = r[1] + shout.innerHTML;
newS = shout.cloneNode( true ) // Deep copy
shout.parentNode.replaceChild( newS, shout )
  woensdag 11 september 2013 @ 19:41:52 #8
118585 Crutch
Filantroop || Taalzwengel
pi_131069459
jQuery is je vriend.
Je moeder is een hamster
pi_131069723
quote:
2s.gif Op woensdag 11 september 2013 10:51 schreef Tijn het volgende:

[..]

Het levert geen robuust programma op. Je moet code schrijven die je kunt vertrouwen. Als je je variabelen niet onder controle hebt, wordt het ontzettend complex om het overzicht te houden naarmate je programma groeit.
Ik snap je punt. Hoe zou jij dit probleem tackelen? Of zou je het probleem helemaal omzeilen?
pi_131069763
quote:
0s.gif Op woensdag 11 september 2013 19:41 schreef Crutch het volgende:
jQuery is je vriend.
jQuery is fantastisch. Met jQuery kan ik bijna alles, terwijl m'n JS kennis heel beperkt is.
  woensdag 11 september 2013 @ 19:55:52 #11
12221 Tijn
Powered by MS Paint
pi_131070098
quote:
0s.gif Op woensdag 11 september 2013 19:48 schreef pascal08 het volgende:

[..]

Ik snap je punt. Hoe zou jij dit probleem tackelen? Of zou je het probleem helemaal omzeilen?
Ik begrijp niet helemaal waarom je überhaupt het probleem hebt dat die functie "te vaak" wordt aangeroepen. Waarom zou dat gebeuren?
pi_131070382
quote:
2s.gif Op woensdag 11 september 2013 19:55 schreef Tijn het volgende:

[..]

Ik begrijp niet helemaal waarom je überhaupt het probleem hebt dat die functie "te vaak" wordt aangeroepen. Waarom zou dat gebeuren?
Het gaat om een aantal inputs die als filter voor een tabel fungeren. Die tabel wordt bij elke jQuery.change() geüpdatet door middel van AJAX. Ik probeer de requests een soort van te pipelinen, zodat de server niet continu wordt bestookt met requests wanneer het niet nodig is.
pi_131070451
quote:
0s.gif Op woensdag 11 september 2013 20:01 schreef pascal08 het volgende:

[..]

Het gaat om een aantal inputs die als filter voor een tabel fungeren. Die tabel wordt bij elke jQuery.change() geüpdatet door middel van AJAX. Ik probeer de requests een soort van te pipelinen, zodat de server niet continu wordt bestookt met requests wanneer het niet nodig is.
Een soort dynamische filters op tabellen ?
pi_131070482
quote:
1s.gif Op woensdag 11 september 2013 20:03 schreef Scorpie het volgende:

[..]

Een soort dynamische filters op tabellen ?
Exact.
pi_131070548
quote:
0s.gif Op woensdag 11 september 2013 20:04 schreef pascal08 het volgende:

[..]

Exact.
Set dan een delay op je invoervelden, dat er na een change 300 of 500 ms gewacht wordt voordat de functie afgaat.
pi_131070711
quote:
1s.gif Op woensdag 11 september 2013 20:05 schreef Scorpie het volgende:

[..]

Set dan een delay op je invoervelden, dat er na een change 300 of 500 ms gewacht wordt voordat de functie afgaat.
Ik heb het eerst op die manier gedaan, maar ik vond de filters niet snel genoeg aanvoelen. De tabel wordt ook niet geüpdatet bij keyup maar bij change, dus ofwel de enter moet indrukt worden of er moet buiten het veld geklikt worden. Zo'n delay heb ik wel toegepast op een naam filter die bij elke keyup een request stuurt.
  woensdag 11 september 2013 @ 20:31:01 #17
12221 Tijn
Powered by MS Paint
pi_131071735
quote:
0s.gif Op woensdag 11 september 2013 20:01 schreef pascal08 het volgende:

[..]

Het gaat om een aantal inputs die als filter voor een tabel fungeren. Die tabel wordt bij elke jQuery.change() geüpdatet door middel van AJAX. Ik probeer de requests een soort van te pipelinen, zodat de server niet continu wordt bestookt met requests wanneer het niet nodig is.
Zolang er geen performance-problemen zijn, zou ik me er niet zo druk over maken.
pi_131096055
quote:
2s.gif Op woensdag 11 september 2013 20:31 schreef Tijn het volgende:

[..]

Zolang er geen performance-problemen zijn, zou ik me er niet zo druk over maken.
Dan heb ik nog een vraag voor je: in die functie wordt een andere functie van een plugin (dataTables) aangeroepen. Stel ik noem mijn table: oTable1, dan refresh ik m'n tabel met: oTable1.fnDraw(). Stel ik verander m'n tabelnaam, dan moet ik overal die functie anders aanroepen. Wat is daar een goede oplossing voor? Gewoon de functie in een andere functie stoppen?
  donderdag 12 september 2013 @ 16:12:56 #19
12221 Tijn
Powered by MS Paint
pi_131097415
Dat is het id van de tabel ofzo?
pi_131097926
quote:
5s.gif Op donderdag 12 september 2013 16:12 schreef Tijn het volgende:
Dat is het id van de tabel ofzo?
Uhm, het is een jQuery element(?) opgeslagen in een variabele. Zoiets als:
1var oTable1 = $('#id').dataTables();
  donderdag 12 september 2013 @ 16:37:23 #21
12221 Tijn
Powered by MS Paint
pi_131098145
Daar ga je gewoon mee om zoals elke variabele toch? Als je een andere variabele van naam verandert, moet je ook overal in je code waar deze variabele wordt gebruikt de naam veranderen.

Ik snap de vraag niet echt :@
pi_131099121
quote:
2s.gif Op donderdag 12 september 2013 16:37 schreef Tijn het volgende:
Daar ga je gewoon mee om zoals elke variabele toch? Als je een andere variabele van naam verandert, moet je ook overal in je code waar deze variabele wordt gebruikt de naam veranderen.

Ik snap de vraag niet echt :@
Oké, dus jij "zegt": "Sloop die timeout van de functie eruit en roep de refresh gewoon op de traditionele manier aan: oTable.fnDraw();". Toch?

Eigenlijk heb ik me het dus veel te ingewikkeld gemaakt. De site draaide voorheen op ronduit belabberde shared host. Nu draait 'ie op een VPS, dus ik denk dat ik maar terug moet gaan naar basic, want de server kan dit wel aan denk ik.
pi_131099149
Ik hoop dat je beter begrijpt wat je aan het doen bent dan ik...
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_131099574
quote:
11s.gif Op donderdag 12 september 2013 17:06 schreef Catch22- het volgende:
Ik hoop dat je beter begrijpt wat je aan het doen bent dan ik...
Dit klinkt nogal verontrustend. :P Moet ik me zorgen gaan maken? :o
pi_131099609
quote:
1s.gif Op donderdag 12 september 2013 17:20 schreef pascal08 het volgende:

[..]

Dit klinkt nogal verontrustend. :P Moet ik me zorgen gaan maken? :o
Gooi je code eens op jsfiddle, volgens mij maak je alles veel te moeilijk
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_131100379
Komt vast van http://datatables.net/
pi_131102063
quote:
11s.gif Op donderdag 12 september 2013 17:21 schreef Catch22- het volgende:

[..]

Gooi je code eens op jsfiddle, volgens mij maak je alles veel te moeilijk
De site gaat binnenkort online, dan kun je de hele JS zien. ;)

quote:
Klopt. Ik ging ervan uit dat iedereen hier de plugin wel kende. Zo niet: zeker het proberen waard. Echt super veel mogelijkheden en erg makkelijk in te stellen als je de documentatie goed doorneemt.
pi_131274441
Ik ben bezig met het maken van een website die is opgebouwd uit 3 kolommen naast elkaar (incl. header, footer, etc).

Het is de bedoeling dat de de hoogte van de website (en de kolommen) altijd 100% is, ongeacht hoeveel tekst / plaatjes de website bevat.
De container heeft wel een 100% hoogte en schikt zich naar de hoogte van het venster.
De 3 kolommen zitten in die container maar veranderen alleen van hoogte als er een regel tekst bijkomt of als ik een height opgeef.

De code is alsvolgt:
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
  dinsdag 17 september 2013 @ 12:23:15 #29
134533 donroyco
dus niet Donroyco
pi_131274498
quote:
5s.gif Op dinsdag 17 september 2013 12:21 schreef karton2 het volgende:
Ik ben bezig met het maken van een website die is opgebouwd uit 3 kolommen naast elkaar (incl. header, footer, etc).

Het is de bedoeling dat de de hoogte van de website (en de kolommen) altijd 100% is, ongeacht hoeveel tekst / plaatjes de website bevat.
De container heeft wel een 100% hoogte en schikt zich naar de hoogte van het venster.
De 3 kolommen zitten in die container maar veranderen alleen van hoogte als er een regel tekst bijkomt of als ik een height opgeef.

De code is alsvolgt:
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
Gooi het eens in jsfiddle.
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
pi_131274564
Google "faux columns".
pi_131276009
quote:
3s.gif Op dinsdag 17 september 2013 12:23 schreef donroyco het volgende:

[..]

Gooi het eens in jsfiddle.
http://jsfiddle.net/H5Uyd/
quote:
14s.gif Op dinsdag 17 september 2013 12:25 schreef KomtTijd... het volgende:
Google "faux columns".
Die ben ik ook tegen gekomen maar ik heb begrepen dat dit niet dé manier zou zijn, achterhaald en zulks.
pi_131277693
Ik denk dat ik hem heb.
De code uit mijn eerste post heb ik minimaal aangepast..
..#container een background-image meegegeven van 939px breed en 1px hoog.
In die afbeelding de kolommen weergegeven met kleuren en hij doet het.
  dinsdag 17 september 2013 @ 14:05:45 #33
56176 Catch22-
Ben je Blind?!
pi_131277753
ook als ze niet even hoog zijn door variabele content?
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_131278489
Tip: maak je plaatje 10/20px hoog, oudere versies van IE slaan helemaal op tilt van backgrounds die te vaak herhaald worden.
En bij een .png maakt het qua bestandsgrootte waarschijnlijk geen verschil.
pi_131309719
Nieuwe vraag in aantocht.
De centrale kolom wordt gevuld met nieuws berichten.
Het is de bedoeling dat de twee kolommen aan de zijkant niet mee bewegen zodra de bezoeker door de nieuwsberichten gaat scrollen.
Met een simpele overflow:scroll; voor het content gedeelte kan ik dat bereiken.
Gevolg is dat ik twee scrollbalken heb: één voor het content gedeelte en één aan de rechter zijde van het scherm.
De meerst rechtse scrollbalk is het gevolg van de 100% hoogte van de achtergrond.
Als ik die 100% kleiner maak dan gaat, neem ik aan, die rechter scrollbalk weg zodat ik alleen de content scrollbalk nog heb.
Het mooiste zou echter zijn als dat ik alleen een scrollbalk rechts aan de rand van het scherm zou hebben en dat ik daarmee door de centrale kolom kan scrollen.

Mijn oplossing zou zijn het vastzetten van de volledige website met uitzondering van het nieuwsdeel.
De volledige website schuift dan mee zodra de bezoeker naar beneden scrollt.
Probleem is dat ik niet weet hoe ik de 100% hoogte van de drie de faux kolommen ga bepalen in de html/css.
Ik ben benieuwd naar jullie advies.

Huidige situatie:
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
pi_131309984
position:fixed is wat je zoekt.

evt. in combinatie met een stukje JS, zodat ze pas fixed worden als de header weggescrold is.
pi_131313167
quote:
14s.gif Op woensdag 18 september 2013 12:16 schreef KomtTijd... het volgende:
position:fixed is wat je zoekt.

evt. in combinatie met een stukje JS, zodat ze pas fixed worden als de header weggescrold is.
Die fixed doet inderdaad wat ik zoek.
Het probleem is echter dat als ik het venster smaller maak de rechter kolom sneller verschuift dan de linker.
Ik ben uitgegaan van dit voorbeeld alleen is daar hetzelfde probleem. De gele balk schuift sneller naar links dan de tekst zelf.
Voorheen liet ik de 3 kolommen naast elkaar floaten binnen in een container maar dat werkt nu ook niet meer natuurlijk door die fixed.

Nu kom ik deze jsFiddle tegen en die laat, volgens mij, zien wat ik bedoel.
Echter die werkt alleen als left:50%; is... Als ik die verander naar bijv. 30% dan schuift alles weer op zijn eigen snelheid.
  woensdag 18 september 2013 @ 14:15:33 #38
56176 Catch22-
Ben je Blind?!
pi_131313263
doet dit alsjeblieft niet... fixed height is nooit een goed idee. Gewoon lekker floaten
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_131313341
quote:
11s.gif Op woensdag 18 september 2013 14:15 schreef Catch22- het volgende:
doet dit alsjeblieft niet... fixed height is nooit een goed idee. Gewoon lekker floaten
Hoe kan ik er dan voor zorgen dat de 2 buitenste kolommen blijven staan terwijl je door de middelste kolom kan scrollen?
Dat kan met overflow, maar dan krijg ik twee scrollbalken.

Zie:
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
pi_131313894
Het gekke is dat mijn footer fixed aan de onderkant van het venster staat.
Wat ik ook doe met het venster, hij blijft altijd op de juiste plek.
Mijn linker en rechter kolom daarentegen.. :')
pi_131314483
...ik heb echt geen idee meer wat je nu allemaal aan het doen bent en wat er precies niet wil lukken.
  woensdag 18 september 2013 @ 15:11:52 #42
56176 Catch22-
Ben je Blind?!
pi_131314759
quote:
5s.gif Op woensdag 18 september 2013 14:18 schreef karton2 het volgende:

[..]

Hoe kan ik er dan voor zorgen dat de 2 buitenste kolommen blijven staan terwijl je door de middelste kolom kan scrollen?
Dat kan met overflow, maar dan krijg ik twee scrollbalken.

Zie:
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
Ja dat zal, maar het is geen papier he. Op het web hebben dingen variabele hoogtes. Je moet dit gewoon niet zo doen en willen.
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_131315792
quote:
14s.gif Op woensdag 18 september 2013 15:00 schreef KomtTijd... het volgende:
...ik heb echt geen idee meer wat je nu allemaal aan het doen bent en wat er precies niet wil lukken.
quote:
11s.gif Op woensdag 18 september 2013 15:11 schreef Catch22- het volgende:

[..]

Ja dat zal, maar het is geen papier he. Op het web hebben dingen variabele hoogtes. Je moet dit gewoon niet zo doen en willen.
Ik heb een .rar geüpload voor degenen die zelf willen kijken: http://www.filedropper.com/voorbeeld
Bevat een index.html met CSS in de head + een .png die de kolommen visualiseerd.

Ik ben eerder weer opnieuw begonnen en heb geprobeerd om de basis op te zetten, maar ik kom er niet meer uit.
Het is de bedoeling dat de website uit 3 kolommen bestaat.
Links een menu, rechts polls en ander spul. Centraal komt de inhoud van de site.
De linker en rechter kolom moeten -altijd- in beeld blijven als de gebruiker naar beneden scrollt.
De linker kolom staat goed en reageert zoals het hoort, ook als ik het venster smaller maak.
De rechter kolom moet identiek reageren maar ik krijg het niet voor elkaar.. hij wil zelfs niet verschijnen.
Mijn eeuwige dank voor degene die het werkend krijgt.
pi_131318947
Met

1
2
3
4
5
6
7
8
9
10
#rechts {
    background-color: #000000;
    height: 500px;
    left: 50%; /* centreren */
    margin-left: 285px; /* helft van de wrapper - de breedte van het element: 970/2 - 200 */ 
    position: fixed;
    right: 0;
    top: 0;
    width: 200px;
}

Is je #rechts sidebar zichtbaar en aan de rechterkant van het scherm gepositioneerd. Maar met alle respect, het is toch geen 1998 meer? Wat ga je doen als die sidebars hoger zijn dan de viewport bijvoorbeeld?
Nee.
  woensdag 18 september 2013 @ 17:33:38 #45
134533 donroyco
dus niet Donroyco
pi_131319281
quote:
0s.gif Op woensdag 18 september 2013 17:22 schreef PimD het volgende:
Met
[ code verwijderd ]

Is je #rechts sidebar zichtbaar en aan de rechterkant van het scherm gepositioneerd. Maar met alle respect, het is toch geen 1998 meer? Wat ga je doen als die sidebars hoger zijn dan de viewport bijvoorbeeld?
Wat hij zegt, hier is een jsfiddle met nog wat tweaks:

http://jsfiddle.net/pUkT6/
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
  woensdag 18 september 2013 @ 21:32:28 #46
118585 Crutch
Filantroop || Taalzwengel
pi_131328749
Je moeder is een hamster
  woensdag 18 september 2013 @ 21:43:05 #47
118585 Crutch
Filantroop || Taalzwengel
pi_131329419
Paar handige jsfiddle tips:

Typ: lorem20 druk op tab en je krijgt twintig woorden lorem ipsum...

Nog meer voorbeelden als je op tab drukt:

In de html-editor:
div.bladiebla wordt: <div class="bladiebla"></div>
div#hoi wordt: <div id="hoi"></div>
a wordt: <a href=""></a>

In de CSS-editor:

bg#333 wordt: background: #eee;
pr3 wordt: padding-right: 3px;

_O_
Je moeder is een hamster
  donderdag 19 september 2013 @ 07:09:35 #48
118011 BrainOverfloW
Fok! around the Clock!
pi_131338624
quote:
0s.gif Op woensdag 18 september 2013 21:43 schreef Crutch het volgende:
Paar handige jsfiddle tips:

Typ: lorem20 druk op tab en je krijgt twintig woorden lorem ipsum...

Nog meer voorbeelden als je op tab drukt:

In de html-editor:
div.bladiebla wordt: <div class="bladiebla"></div>
div#hoi wordt: <div id="hoi"></div>
a wordt: <a href=""></a>

In de CSS-editor:

bg#333 wordt: background: #eee;
pr3 wordt: padding-right: 3px;

_O_
Dat is de syntax van Emmet, daar kun je nog veel meer leuks mee doen.

Bijvoorbeeld:

1ul>li.link$*6>a[href="#"]
wordt na een druk op Tab
1
2
3
4
5
6
7
8
<ul>
    <li class="link1"><a href="#"></a></li>
    <li class="link2"><a href="#"></a></li>
    <li class="link3"><a href="#"></a></li>
    <li class="link4"><a href="#"></a></li>
    <li class="link5"><a href="#"></a></li>
    <li class="link6"><a href="#"></a></li>
</ul>

Emmet is ook toe te voegen aan veel code editors. Erg handig om snel je code te kunnen typen.
Whether or not you can become great at something, you can always become better.
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
pi_131357521
Edit: Probleem opgelost.
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.


[ Bericht 4% gewijzigd door Lucaas op 19-09-2013 20:07:42 ]
pi_131358949
quote:
0s.gif Op donderdag 19 september 2013 19:33 schreef Lucaas het volgende:
Beste FOK!ers,

Dit jaar informatica in mijn pakket gekozen op school, erg interessant.
Nu heb ik een opgave waarbij ik doormiddel van JavaScript (verwerkt HTML) een site moet maken met een manier om rente op rente te berekenen voor een bepaald bedrag.

Stel:
Ik heb een rekening met 150.000 euro, daar krijg ik 3% rente op en ik wil weten hoeveel ik heb over 6 jaar.
Dan voer ik dus het bedrag in, de rente, en het aantal jaar en moet dan het bedrag krijgen wat er na die 6 jaar opstaat.

Echter kom ik niet verder dan 1 jaar. Iemand die mij kan helpen?

Hier is mijn script tot nu toe (CSS script even terzijde, die is voor mijn vraag niet belangrijk):
...
Allereerst je kunt je code tussen code tags zetten dat leest wat fijner. Verder ben je op de goede weg. Weet je hoe je wiskundig rente op rente berekent? Verder nog een stijl tip die je code overzichtelijker maakt: maak een aparte functie bereken (startbedrag, rente, jaren) { .. } die de berekening zelf doet. Dan wordt je code ongeveer:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
function bereken (startbedrag, rente, jaren) {
  var resultaat = ...;
  return resultaat;
}

function berekening() {
  var startbedrag = parseFloat(document.mijnForm.bedrag.value);
  var rente = parseFloat(document.mijnForm.rente.value);
  var jaren = parseInt(document.mijnForm.jaar.value);

  var resultaat = bereken (startbedrag, rente, jaren);

  alert ('Het bedrag is ¤ '+resultaat)
}
  donderdag 19 september 2013 @ 20:53:47 #51
118585 Crutch
Filantroop || Taalzwengel
pi_131361349
quote:
0s.gif Op donderdag 19 september 2013 07:09 schreef BrainOverfloW het volgende:

[..]

Dat is de syntax van Emmet, daar kun je nog veel meer leuks mee doen.

Bijvoorbeeld:
[ code verwijderd ]

wordt na een druk op Tab
[ code verwijderd ]

Emmet is ook toe te voegen aan veel code editors. Erg handig om snel je code te kunnen typen.
Ik heb het aanstaan in PhpStorm ja. :7
Maar ik wist niet dat het ook in JSFiddle kon.

Kwam er ook bij toeval achter omdat ik het nou eenmaal in mijn vingers heb zitten.
Je moeder is een hamster
abonnement Unibet Coolblue Bitvavo
Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')