abonnement Unibet Coolblue Bitvavo
pi_112061346
[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/
pi_112061508
Ik ben weer eens aan de knutsel met mijn weblog en vroeg me het volgende af:
De weblog bestaat uit een post gedeelte en een sidebar. Persoonlijk vind ik het niet mooi als de een langer of korter is dan de ander, maar aangezien posts altijd afwisselende lengte hebben is het niet echt mogelijk om een sidebar te maken die altijd lang genoeg is.
Nu vroeg ik me af of er middels html/css of met een tabel een manier is om te zorgen dat de overgebleven ruimte op wordt gevuld met plaatjes en of andere inhoud, maar op zo'n manier dat deze precies ophoudt waar de posts op houden.

Ik heb al zitten Googlen en zelf zitten denken hoe dit mogelijk zou zijn, maar kom helaas niet tot een antwoord, ookal heb ik het gevoel wellicht iets heel voordehandliggends over het hoofd te zien..
Heeft iemand een idee in wat voor een richting ik moet denken om iets dergelijks te maken?
  zaterdag 26 mei 2012 @ 20:49:27 #3
87680 Mirel
Mirel wil een bongophone.
pi_112061903
Wellicht de post een min-height geven die net zo hoog is als de height van de sidebar?
When all else fails, you always have delusion.
pi_112062561
Uhm, ja maar er verschijnen 10 posts per pagina, dus ik vermoed dat wat lengte betreft aan het post gedeelte niet veel te doen is!
  zaterdag 26 mei 2012 @ 21:21:10 #5
87680 Mirel
Mirel wil een bongophone.
pi_112063576
Dat is dan misschien best lelijk he :@
When all else fails, you always have delusion.
  zaterdag 26 mei 2012 @ 21:27:29 #6
299167 stefanhaan
Bloeddorstige wasbeer
pi_112063992
quote:
0s.gif Op zaterdag 26 mei 2012 21:03 schreef Maartel het volgende:
Uhm, ja maar er verschijnen 10 posts per pagina, dus ik vermoed dat wat lengte betreft aan het post gedeelte niet veel te doen is!
eerste hit via google:
http://www.ejeliot.com/blog/61
It was an opportunity to honour our memories and to make room for new ones
pi_112064438
Bedankt! Weer een gevalletje van op totaal verkeerde formuleringen Googlen dus :@

(al krijg ik de indruk dat dit met name om een achtergrondkleur/afbeelding gaat en dat heb ik al wel)
pi_112117050
ik ben aan het pielen met een tab slide,
op internet een plugin gevonden
http://www.building58.com/examples/tabSlideOut.html

maar dit doet net niet wat ik wil...
maar ik kom er niet uit...
ik wil graag de tab gebruiken EN een andere div om dezelfde tab te openen...
krijg het dus niet voor elkaar
pi_112117220
Wat werkt niet, wat heb je zelf geprobeerd, waar is je code voorbeeld en waar denk je dat het aan kan liggen.
pi_112117442
quote:
14s.gif Op maandag 28 mei 2012 10:22 schreef Scorpie het volgende:
Wat werkt niet, wat heb je zelf geprobeerd, waar is je code voorbeeld en waar denk je dat het aan kan liggen.
sorry
ik gebruik de plugin als in de webpagina...werkt prima
maar nu wil ik ook aan een andere div toewijzen dat de tab open gaat

1
2
3
4
5
6
        $('.slide-out-div').tabSlideOut({
                tabHandle: '.handle',                         //class of the element that will be your tab -doesnt have to be an anchor
                pathToTabImage: 'images/contact_tab.gif',     //relative path to the image for the tab
                imageHeight: '133px',                         //height of tab image
                imageWidth: '44px',                           //width of tab image   
        });

dit is de code die in de html moet om de plugin te laten werken
heel simpel gedacht dacht ik, als ik de "handle" als class bij een andere div zet dat deze dan de tab zou aansturen...hmm..niet dus..of iig ik doe het fout

waarschijnlijk zal de plugin zo inelkaar zitten dat het niet kan
pi_112117537
De plugin hecht zichzelf aan een element, dus dat werkt idd niet. Zal straks die plugin eens doorspitten.
pi_112117590
quote:
0s.gif Op maandag 28 mei 2012 10:38 schreef Scorpie het volgende:
De plugin hecht zichzelf aan een element, dus dat werkt idd niet. Zal straks die plugin eens doorspitten.
ik was de bloglijst aan het doorspitten..
kwam daar iets tegen van

1
2
3
4
5
$(”.handle”).click();

Actually, since I’m extending this class, I did this:

obj.find(”.handle”).click();

maar hoe ik dat dan zou moeten inpassen :?
pi_112117842
quote:
0s.gif Op maandag 28 mei 2012 10:41 schreef MrNiles het volgende:

[..]

ik was de bloglijst aan het doorspitten..
kwam daar iets tegen van
[ code verwijderd ]

maar hoe ik dat dan zou moeten inpassen :?
Zodra je clicked op de andere div vuur je een event af die de klik op de andere div nabootst.

Dus:

1
2
3
$('divClassOfId').on('click', function() { 
  $('.slide-out-div').click(); 
});


[ Bericht 0% gewijzigd door #ANONIEM op 28-05-2012 10:53:36 ]
pi_112118885
quote:
0s.gif Op maandag 28 mei 2012 10:52 schreef Scorpie het volgende:

[..]

Zodra je clicked op de andere div vuur je een event af die de klik op de andere div nabootst.

Dus:
[ code verwijderd ]

klinkt goed...lees ook iets vergelijkbaars in de blog
maar het zal wel aan de warmte liggen...t werkt nie

divje gemaakt
<div class="slidediv"></div>
is een widht en height gegeven..is dus een zichtbaar vierkantje

onder het instelscript
dit gezet

1
2
3
<script>
$(’.slidediv’).click(function(){$(’.handle’).click();});
</script>

.slide-out-div vervangen door handle

tab doet niets als ik op de div klik
werkt nog wel op de gewone manier

[ Bericht 33% gewijzigd door MrNiles op 28-05-2012 12:01:49 ]
pi_112119975
Is .handle de naam van de div waar de plugin mee is geinitaliseerd?
pi_112123583
Is er met html/css een methode om een soort van verticale marquée te doen, maar dan eentje die niet continu scrollt, maar om de paar seconden eventjes een regel verder schuift? Of moet ik me dan toch echt meer in javascript ed verdiepen?
pi_112123864
Met CSS transitions moet zoiets wel te doen zijn. Of je dat wilt doen is natuurlijk een tweede. Voor mijn gevoel is zo'n marquee eerder gedrag en zou het w.m.b. opgelost moeten worden in Javascript.
Nee.
pi_112127482
quote:
0s.gif Op zaterdag 26 mei 2012 21:34 schreef Maartel het volgende:
Bedankt! Weer een gevalletje van op totaal verkeerde formuleringen Googlen dus :@

(al krijg ik de indruk dat dit met name om een achtergrondkleur/afbeelding gaat en dat heb ik al wel)
Dat klopt, faux columns werkt door een achtergrond plaatje in de omvattende container te zetten en die verticaal te herhalen zodat de illusie ontstaat dat de kortste van de kolommen net zo lang is.

Je kunt het ook doen door de omvattende container "display: table" mee te geven in de css en de sidebar en post gedeelte "display:table-cell;"
pi_112142639
Mijn eerder genoemde probleem is opgelost mede door de hulp van MrNiles.

Ik moest deze regel toevoegen bij de head.phtml

1Cufon.replace('.stone-help .title', { fontFamily: 'AlternateGothic2 BT' });
If not now, then when.
pi_112145874
quote:
0s.gif Op maandag 28 mei 2012 12:07 schreef Scorpie het volgende:
Is .handle de naam van de div waar de plugin mee is geinitaliseerd?
-fixed-

[ Bericht 85% gewijzigd door MrNiles op 29-05-2012 13:39:34 ]
pi_112265633
ik heb een horizontaal menu opgemaakt als tabbladen, maar meer tabbladen dan horizontale ruimte, waardoor de tabbladen 2 regels innemen. De tabs op de bovenste regel zijn daardoor niet echt tabs meer:


Weten jullie een (makkelijke) manier om dat elegant op te lossen?
pi_112265736
Minder tabbladen maken.
  donderdag 31 mei 2012 @ 15:24:38 #23
87680 Mirel
Mirel wil een bongophone.
pi_112266390
Een rij van tabs boven en een rij van tabs beneden, als je op een rij klikt, schuift die naar voren?
Netzoals windows doet of deed bij optievensters met teveel tabbladen.

Bij options:
When all else fails, you always have delusion.
  donderdag 31 mei 2012 @ 15:28:11 #24
56176 Catch22-
Ben je Blind?!
pi_112266564
quote:
14s.gif Op donderdag 31 mei 2012 15:07 schreef KomtTijd... het volgende:
ik heb een horizontaal menu opgemaakt als tabbladen, maar meer tabbladen dan horizontale ruimte, waardoor de tabbladen 2 regels innemen. De tabs op de bovenste regel zijn daardoor niet echt tabs meer:
[ link | afbeelding ]

Weten jullie een (makkelijke) manier om dat elegant op te lossen?
anders grouperen, als je zoveel tabs hebt dan doe je iets niet goed
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_112268234
quote:
11s.gif Op donderdag 31 mei 2012 15:28 schreef Catch22- het volgende:

[..]

anders grouperen, als je zoveel tabs hebt dan doe je iets niet goed
Mee eens hoor, maar dat neemt het probleem niet weg. Als het er 5 zouden zijn kunnen ze bij elkaar nog steeds breder zijn dan iemands beeldscherm.
quote:
0s.gif Op donderdag 31 mei 2012 15:24 schreef Mirel het volgende:
Een rij van tabs boven en een rij van tabs beneden, als je op een rij klikt, schuift die naar voren?
Netzoals windows doet of deed bij optievensters met teveel tabbladen.

Bij options:
[ afbeelding ]
...Dat kan, maar dan gaat het nog een halve dag uitzoekwerk worden... hoopte eigenlijk op een easy fix...

Misschien klus ik wel wat firefox-achtigs dat je met pijltjes naar links en rechts kunt schuiven...
abonnement Unibet Coolblue Bitvavo
Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')