abonnement Unibet Coolblue
pi_157094772


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.

Vragen over PHP, SQL of andere serverside programmeertalen horen niet in dit topic. Deze kun je stellen in [PHP/MySQL] voor dummies of open zelf een topic.
Voor vragen over webhosting, domeinnamen enz. kun je terecht in 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: [Wordpress]Algemeen 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.
Nog beter is om een snippet in Codepen of JSFiddle te plakken. Hierdoor kunnen anderen je ook makkelijker helpen.

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.

Hier een paar artikelen over CSS elementen die vaak voor verwarring zorgen
CSS Floats 101
CSS Positioning 101

Heb je zin om HTML, CSS of Javascript leren, dan zijn deze video tutorials een goede plek om te beginnen
30 Days to Learn HTML & CSS
30 Days to Learn jQuery
JavaScript from null

Overige tips & tricks
jQuery Tips and Tricks
Hidden Features of JavaScript

Populaire frameworks
• [HTML/CSS] Bootstrap
• [HTML/CSS] Foundation
• [JS] jQuery
• [JS] AngularJS
• [JS] Backbone
• [JS] Ember.js
pi_157094842
Mijn laatste vraag

http://codepen.io/anon/pen/OyvmBR

Er zijn vier bolletjes die naar een foto sliden, de rest slide nergens heen. Misschien kan iemand mij helpen?
  zondag 25 oktober 2015 @ 20:26:55 #3
91039 mstx
2x1/2 = 1/2 x 1/2
pi_157095123
quote:
11s.gif Op zondag 25 oktober 2015 20:19 schreef ikbenrond het volgende:
Mijn laatste vraag

http://codepen.io/anon/pen/OyvmBR

Er zijn vier bolletjes die naar een foto sliden, de rest slide nergens heen. Misschien kan iemand mij helpen?
1. je bolletjes staan allemaal door elkaar, kijk naar de margin-left
2. .overflow-wrapper moet 1000% breed zijn bij 10 items, het was 400% voor 4 items
3. .slide img moet 10% breed zijn voor 10 items, het was 25% voor 4 items
4. #Slide10:checked ~ .overflow-wrapper moet -900% zijn

http://codepen.io/anon/pen/Qjmvzq
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
pi_157096788
quote:
0s.gif Op zondag 25 oktober 2015 20:26 schreef mstx het volgende:

[..]

1. je bolletjes staan allemaal door elkaar, kijk naar de margin-left
2. .overflow-wrapper moet 1000% breed zijn bij 10 items, het was 400% voor 4 items
3. .slide img moet 10% breed zijn voor 10 items, het was 25% voor 4 items
4. #Slide10:checked ~ .overflow-wrapper moet -900% zijn

http://codepen.io/anon/pen/Qjmvzq
Ohh :o Thanks man. :)

Ze staan ook alle 10 netjes in het midden nu.
  zondag 25 oktober 2015 @ 21:20:22 #5
118011 BrainOverfloW
Fok! around the Clock!
pi_157098146
quote:
14s.gif Op zondag 25 oktober 2015 20:56 schreef ikbenrond het volgende:

[..]

Ohh :o Thanks man. :)

Ze staan ook alle 10 netjes in het midden nu.
Nog een puntje om je code wat leesbaarder te houden. Als je stijlen hebt die op veel elementen terug komen kun je die beter samen in een class zetten die je dan aan al die elementen plakt.

In jouw geval kopieer je nu de hele stijl van je labels voor alle 10 de labels. Echter veranderen alleen de margin-left en de bottom. De rest van de regels kunnen dus prima samen een class krijgen.

Daarmee het je minder code, 70 regels minder in dit geval, wat niet alleen leesbaarder is maar ook makkelijker aanpasbaar. Nu hoef je een toekomstige wijziging maar op één plek uit te voeren in plaats van het naar 10 plekken te moeten kopiëren.

http://codepen.io/anon/pen/XmEgJO
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_157100569
quote:
0s.gif Op zondag 25 oktober 2015 21:20 schreef BrainOverfloW het volgende:

[..]

Nog een puntje om je code wat leesbaarder te houden. Als je stijlen hebt die op veel elementen terug komen kun je die beter samen in een class zetten die je dan aan al die elementen plakt.

In jouw geval kopieer je nu de hele stijl van je labels voor alle 10 de labels. Echter veranderen alleen de margin-left en de bottom. De rest van de regels kunnen dus prima samen een class krijgen.

Daarmee het je minder code, 70 regels minder in dit geval, wat niet alleen leesbaarder is maar ook makkelijker aanpasbaar. Nu hoef je een toekomstige wijziging maar op één plek uit te voeren in plaats van het naar 10 plekken te moeten kopiëren.

http://codepen.io/anon/pen/XmEgJO
Thanks voor de tip, dat is inderdaad wat duidelijker
pi_157101891
quote:
0s.gif Op zondag 25 oktober 2015 21:20 schreef BrainOverfloW het volgende:

[..]

Nog een puntje om je code wat leesbaarder te houden. Als je stijlen hebt die op veel elementen terug komen kun je die beter samen in een class zetten die je dan aan al die elementen plakt.

In jouw geval kopieer je nu de hele stijl van je labels voor alle 10 de labels. Echter veranderen alleen de margin-left en de bottom. De rest van de regels kunnen dus prima samen een class krijgen.

Daarmee het je minder code, 70 regels minder in dit geval, wat niet alleen leesbaarder is maar ook makkelijker aanpasbaar. Nu hoef je een toekomstige wijziging maar op één plek uit te voeren in plaats van het naar 10 plekken te moeten kopiëren.

http://codepen.io/anon/pen/XmEgJO
Volgens mij verandert "bottom" helemaal niet. En als het voor een paar items wel verandert, kun je alsnog de standaardwaarde bij de class zetten en de afwijkende waarde bij de betreffende id's.
  zondag 25 oktober 2015 @ 22:54:59 #8
118011 BrainOverfloW
Fok! around the Clock!
pi_157102861
quote:
0s.gif Op zondag 25 oktober 2015 22:29 schreef Light het volgende:

[..]

Volgens mij verandert "bottom" helemaal niet. En als het voor een paar items wel verandert, kun je alsnog de standaardwaarde bij de class zetten en de afwijkende waarde bij de betreffende id's.
Helemaal gelijk in, niet goed genoeg opgelet bij het aanpassen. Wat ironisch genoeg mijn punt alleen maar duidelijker maakt. Hou je code zo overzichtelijk mogelijk.

Een standaardwaarde opnemen in je class die je bij uitzonderingen overschrijft vanuit een andere class/id is inderdaad makkelijker dan geen standaardwaarde op te nemen.

Uiteindelijk valt het allemaal terug op het principe van Don't Repeat Yourself (DRY). Als je merkt dat je code vaak hergebruikt moet je je afvragen of er niet een betere manier is om diezelfde code vanuit verschillende plekken aan te spreken.
In het geval van CSS kan dat door het in een class te zetten. Bij Javascript kun je het in een functie zetten die je aanspreekt waneer je het nodig hebt.
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
  maandag 26 oktober 2015 @ 08:01:40 #9
56176 Catch22-
Ben je Blind?!
pi_157105317
Nog beter is om een CSS preprocessor te gebruiken (sass of less). Houdt je code netter en beter onderhoudbaar. En je hebt ook minder classes nodig.
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_157105363
quote:
0s.gif Op maandag 26 oktober 2015 08:01 schreef Catch22- het volgende:
Nog beter is om een CSS preprocessor te gebruiken (sass of less). Houdt je code netter en beter onderhoudbaar. En je hebt ook minder classes nodig.
Dan had je waarschijnlijk een mixin gepakt in plaats van een class te gebruiken. Dat zou ik juist een nadeel vinden, al was het maar omdat je denkt dat je DRY bezig bent maar de uiteindelijke css dat helemaal niet meer is.
  maandag 26 oktober 2015 @ 08:11:17 #11
56176 Catch22-
Ben je Blind?!
pi_157105379
quote:
0s.gif Op maandag 26 oktober 2015 08:08 schreef Light het volgende:

[..]

Dan had je waarschijnlijk een mixin gepakt in plaats van een class te gebruiken. Dat zou ik juist een nadeel vinden, al was het maar omdat je denkt dat je DRY bezig bent maar de uiteindelijke css dat helemaal niet meer is.
In plaats van classes toevoegen in je dom, voeg je een mixin toe aan je class. Vind ik persoonlijk netter.
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_157105488
Blijft een lastige discussie, of je nou mixins moet gebruiken, extends of gewoon extra classes in je HTML. Ik neig nog steeds heel erg naar extra classes. Misschien dat je het 'composition over inheritance' zou kunnen noemen.
Bleuh.
pi_157116124
quote:
1s.gif Op maandag 26 oktober 2015 08:11 schreef Catch22- het volgende:

[..]

In plaats van classes toevoegen in je dom, voeg je een mixin toe aan je class. Vind ik persoonlijk netter.
Afhankelijk van de situatie. Als je uitgaat van de css in de tweede post van dit topic, is het handiger om het eerst op te ruimen zoals BrainOverfloW gedaan heeft. Daarna kun je misschien nog wat doen met een css preprocessor. Als je eerst preprocessors gaat gebruiken, krijg je 10 id's met dezelfde mixin.
pi_157116405
quote:
0s.gif Op maandag 26 oktober 2015 08:29 schreef PimD het volgende:
Blijft een lastige discussie, of je nou mixins moet gebruiken, extends of gewoon extra classes in je HTML. Ik neig nog steeds heel erg naar extra classes. Misschien dat je het 'composition over inheritance' zou kunnen noemen.
Ik vind vooral de variabelen en het kunnen uitvoeren van berekeningen van preprocessors erg makkelijk. Dan kunnen dingen ineens logische namen krijgen. Wel zo prettig bij het nalezen van code en het zien van afhankelijkheden.
  maandag 26 oktober 2015 @ 20:21:38 #15
230788 n8n
Pragmatisch
pi_157119207
Ik schrijf mijn css net anders dan de meeste developers die ik ken. Ben indertijd met de fok lay-out mobiel op zoek gegaan naar een compacte manier om css te schrijven in een tijd dat mobiele browsers niet meer dan 25KB uncompressed wilden cachen.

In plaats van per selector meerdere regels declaraties neer te zetten, doe ik het andersom. Eén declaratie met meerdere selectors waar die van toepassing is. Mijn sheet deel ik dan op in een reset, typografie, layout, en ornamenten. Nog een raw file om dingen uit te proberen - wat je achteraf wel op moet schonen. De variabelen haal ik uit een var.color.scss en var.size.scss waar ik een naming convention - bijna - heb uitgedokterd.

Het ziet er dan als volgt uit:

style.scss


en een deel van layout.scss


Het is wat meer moeite om op te zetten maar je houdt een serieus compacte css over, en zonder je html te vervuilen met allerhande classes overal.
Specialization is for insects”.—Robert Heinlein
  maandag 26 oktober 2015 @ 20:34:29 #16
12221 Tijn
Powered by MS Paint
pi_157119626
quote:
0s.gif Op maandag 26 oktober 2015 18:58 schreef Light het volgende:

[..]

Ik vind vooral de variabelen en het kunnen uitvoeren van berekeningen van preprocessors erg makkelijk.
Je kunt calc() tegenwoordig ook zonder preprocessor gebruiken.
  maandag 26 oktober 2015 @ 20:36:21 #17
230788 n8n
Pragmatisch
pi_157119665
quote:
14s.gif Op maandag 26 oktober 2015 20:34 schreef Tijn het volgende:

[..]

Je kunt calc() tegenwoordig ook zonder preprocessor gebruiken.
voor mij geen issue meer met border-box, had IE6 het toch bij het juiste eind.
Specialization is for insects”.—Robert Heinlein
pi_157121105
quote:
14s.gif Op maandag 26 oktober 2015 20:34 schreef Tijn het volgende:

[..]

Je kunt calc() tegenwoordig ook zonder preprocessor gebruiken.
Daar zijn wel wat issues mee.

[ Bericht 29% gewijzigd door Light op 26-10-2015 21:28:39 ]
  maandag 26 oktober 2015 @ 22:22:57 #19
12221 Tijn
Powered by MS Paint
pi_157124138
quote:
0s.gif Op maandag 26 oktober 2015 21:13 schreef Light het volgende:
wat issues
Niks dat een polyfill niet kan fixen :)
pi_157124176
Ik zit een beetje op de n8n route maar dan met Stylus, ben zelf alleen wel erg van het benoemen van dingen.

1header .icon

Zou bij mij eerder zoiets zijn

1.Header__icon

:P En even wat anders, schaam me haast om het te zeggen. Maar ik ben laatst voor de grap eens in flexbox gedoken.
:o Mijn leven is sindsdien veranderd.
  maandag 26 oktober 2015 @ 22:58:50 #21
230788 n8n
Pragmatisch
pi_157125006
Die .icon heeft nog andere styling die onafhankelijk is van de header context. Met jouw voorbeeld heb je dan - wellicht - ook een .Section__icon (waarom die interpunctie zo?).

Maak er dan .header.icon van, dan kan je ze nog los van elkaar selecteren.
Specialization is for insects”.—Robert Heinlein
  maandag 26 oktober 2015 @ 23:13:50 #22
56176 Catch22-
Ben je Blind?!
pi_157125435
Bem he. Ik ben er geen fan van
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?
  maandag 26 oktober 2015 @ 23:17:32 #23
230788 n8n
Pragmatisch
pi_157125533
Ik doop mijn syntax do:css, declaration oriented. Just do it, zoals ze zo mooi zeggen.

Edit: https://css-tricks.com/bem-101 meh ;(
Specialization is for insects”.—Robert Heinlein
pi_157125613
quote:
0s.gif Op maandag 26 oktober 2015 23:13 schreef Catch22- het volgende:
Bem he. Ik ben er geen fan van
Inderdaad, http://getbem.com/naming/
Ik heb hiervoor gekozen omdat de css van bij ons op het werk een grote bende is, en de !importants je om de oren vliegen. Gebruik het nu een aantal maanden en valt me nog niet tegen, en anders is het in ieder geval een consistente bende. :P

Ik ben geen "frontender" maar ik sta altijd open voor betere alternatieven.
pi_157128337
BEM en namespacing, ik ben er groot fan van. Zorgt er IMO echt voor dat je veel beter nadenkt over hergebruik en het opsplitsen van je CSS in herbruikbare stukjes.

Flexbox is inderdaad briljant, hoewel we het nu wel gaan misbruiken voor dingen waar eigenlijk de Grid-module van CSS voor bedoeld is - maar ja, die wordt nog nauwelijks ondersteund.
Bleuh.
  dinsdag 27 oktober 2015 @ 08:22:24 #26
56176 Catch22-
Ben je Blind?!
pi_157128500
Ik vind de syntax niet zo geweldig. En CSS is al cascading, om dat dan ook in je naamgeving te doen vind ik niet zo nodig.

Ik ben de enige frontender en je treft in mijn CSS vrijwel nooit important aan. Dus volgens mij doe ik t prima.
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?
  dinsdag 27 oktober 2015 @ 10:12:11 #27
230788 n8n
Pragmatisch
pi_157129865
BEM haalt het hele cascading idee van css weg, en modulair opbouwen kan natuurlijk ook zonder elk uniek friemeltje een naam van 30 karakters te geven met daarnaast nog --uitzonderingen.

Wat zeker helpt is naming conventions maar ook pattern libraries, een mooie catalogus met modules waar van alles uit overgenomen kan worden. Wat ook helpt is 1 persoon verantwoordelijk maken voor de css in de uiteindelijke vorm, daarom heb ik een raw.nathan.scss, dan kan je elk team-lid zo’n bestand geven.

Door de css op te organiseren op property in plaats van selectors is het ook veel makkelijker te identificeren wanneer een waarde overruled wordt, ze passen vaak tegelijk op je scherm.
Specialization is for insects”.—Robert Heinlein
pi_157165518
DIG / Achtergrond
Iemand die me kan helpen?
  woensdag 28 oktober 2015 @ 19:39:52 #29
56176 Catch22-
Ben je Blind?!
pi_157165594
quote:
0s.gif Op woensdag 28 oktober 2015 19:37 schreef grotenaz het volgende:
DIG / Achtergrond
Iemand die me kan helpen?
druk eens op f12 en kijk bij net en console
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 28 oktober 2015 @ 20:46:23 #30
134533 donroyco
dus niet Donroyco
pi_157167864
quote:
1s.gif Op woensdag 28 oktober 2015 20:41 schreef grotenaz het volgende:

[..]

Thanks man, hij doet het! Ik heb nog een vraagje:
Sommige websites (denk aan NU.nl, GeenStijl.nl) hebben een pagina indeling met een achtergrond en alleen in het midden inhoud/artikelen, als je begrijpt wat ik bedoel. Ik kende vroeger de code om dit te doen, maar ben na een programmerloze periode de code vergeten.
Enige kans dat jij (of een andere FOK!er) mij kan helpen? Bij voorbaat dank
1
2
3
4
.foo {
width: 100px;
margin: 0 auto;
}
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_157258572
Probleem: (verticaal) menu wil niet onder het logo gaan staan.
Code:

<body> <div class="logo"> <br> <br>
<a href="website"> <img src="logo.png" align="left"> </a> </div> <br> <br>

<div class="menu">
<table> <tr> <th> <a href="overons.menu.php"> Over Ons </a> </tr> </th>
<tr> <th> <a href="contact.menu.php"> Contact </a> </tr> </tr> </table>

Heeft iemand oplossingen?
  zondag 1 november 2015 @ 22:24:00 #32
56176 Catch22-
Ben je Blind?!
pi_157259405
Een table, serieus?
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_157259616
quote:
0s.gif Op zondag 1 november 2015 22:24 schreef Catch22- het volgende:
Een table, serieus?
Ja, hoezo?
pi_157259844
quote:
0s.gif Op zondag 1 november 2015 22:04 schreef grotenaz het volgende:
Probleem: (verticaal) menu wil niet onder het logo gaan staan.
Code:

<body> <div class="logo"> <br> <br>
<a href="website"> <img src="logo.png" align="left"> </a> </div> <br> <br>

<div class="menu">
<table> <tr> <th> <a href="overons.menu.php"> Over Ons </a> </tr> </th>
<tr> <th> <a href="contact.menu.php"> Contact </a> </tr> </tr> </table>

Heeft iemand oplossingen?
• Gebruik de [code][/code] tags (of klik op code.png)
• Geen tables gebruiken, (behalve voor tabulaire data, wat een menu zeker niet is)
• Witruimte toevoegen doe je in stylesheets, niet door br-tags te gebruiken.
pi_157260034
quote:
0s.gif Op zondag 1 november 2015 22:35 schreef Light het volgende:

[..]

• Gebruik de
[ code verwijderd ]

tags (of klik op [ afbeelding ])
• Geen tables gebruiken, (behalve voor tabulaire data, wat een menu zeker niet is)
• Witruimte toevoegen doe je in stylesheets, niet door br-tags te gebruiken.
-Met wat voor tag moet ik een menu dan in elkaar coderen?
-Witruimte dmv stijlbladen? Zou je willen uitleggen hoe?
  zondag 1 november 2015 @ 22:51:18 #36
91039 mstx
2x1/2 = 1/2 x 1/2
pi_157260351
Als je al tables gebruikt zorg dan ook dat de tags goed staan, er staan nu allemaal TR en TH's dubbel en door elkaar :')

Maar normaal zet je een menu in een <nav> en <ul>, en stel je de witruimte in met margins. Een table is alleen bedoeld voor tabulaire data.
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
  zondag 1 november 2015 @ 23:01:50 #37
12221 Tijn
Powered by MS Paint
pi_157260709
quote:
1s.gif Op zondag 1 november 2015 22:41 schreef grotenaz het volgende:

[..]

-Met wat voor tag moet ik een menu dan in elkaar coderen?
Wat dacht je van <nav> met daarin een lijstje met links?
  dinsdag 3 november 2015 @ 17:16:34 #38
230788 n8n
Pragmatisch
pi_157295281
Niet echt voor dummies, of wel maar dan voor wiskunde (met JS) :+

Ik heb een functie die van een string een sample neemt op random plekken. De lengte van de string is variabel. De hoeveelheid samples zal tussen de 10 en 1000 komen te liggen. Het punt is alleen dat de string lengte kan variëren van een paar duizend karakters tot een paar miljoen.

Nu komt de wiskunde, ik wil de hoeveelheid samples exponentieel laten dalen omdat het bij lange strings qua performance een potentieel drama wordt. Ik heb het geïllustreerd met een curve ter indicatie (geen exacte waarden).



Nu de hamvraag; weet iemand of en - indien mogelijk - hoe dit kan? Is er een wiskunde genie aanwezig?

Bedankt

Edit: had de curve verkeerd om :@ anyway, heb het nu kwadratisch opgelost met Math.sqrt().

1var i = string.length; var samples = Math.ceil( i / Math.sqrt(i) );


[ Bericht 11% gewijzigd door n8n op 03-11-2015 17:59:29 ]
Specialization is for insects”.—Robert Heinlein
  dinsdag 3 november 2015 @ 18:19:46 #39
12221 Tijn
Powered by MS Paint
pi_157296301
Waarom zou het langer duren om 100 chars uit een string met lengte 1000 te halen dan uit een string met lengte 1000000?
  dinsdag 3 november 2015 @ 18:24:09 #40
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157296362
quote:
5s.gif Op dinsdag 3 november 2015 18:19 schreef Tijn het volgende:
Waarom zou het langer duren om 100 chars uit een string met lengte 1000 te halen dan uit een string met lengte 1000000?
Hij wil het aantal samples doen afnemen naarmate de lengte van de string toeneemt.
  dinsdag 3 november 2015 @ 18:28:00 #41
230788 n8n
Pragmatisch
pi_157296444
quote:
5s.gif Op dinsdag 3 november 2015 18:19 schreef Tijn het volgende:
Waarom zou het langer duren om 100 chars uit een string met lengte 1000 te halen dan uit een string met lengte 1000000?
Ik was eerder met dit bezig en had nu wat dingen door de war. Ik wil dat het percentage van samples langzaam omlaag gaat. Dus op 100.000 karakters kunnen er 200 samples gepakt worden, maar met 10.000.000 maar 500, bijvoorbeeld. Dus het aantal samples moet niet lineair omhoog gaan maar binnen de perken gehouden worden.

Volgens mij is m’n code net alsnog lineair :') heb in ieder geval een harde limiet van 1000 samples.
Specialization is for insects”.—Robert Heinlein
  dinsdag 3 november 2015 @ 18:28:19 #42
230788 n8n
Pragmatisch
pi_157296451
quote:
0s.gif Op dinsdag 3 november 2015 18:24 schreef Ser_Ciappelletto het volgende:

[..]

Hij wil het aantal samples doen afnemen naarmate de lengte van de string toeneemt.
precies
Specialization is for insects”.—Robert Heinlein
  dinsdag 3 november 2015 @ 18:39:50 #43
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157296685
quote:
7s.gif Op dinsdag 3 november 2015 18:28 schreef n8n het volgende:

[..]

Ik was eerder met dit bezig en had nu wat dingen door de war. Ik wil dat het percentage van samples langzaam omlaag gaat. Dus op 100.000 karakters kunnen er 200 samples gepakt worden, maar met 10.000.000 maar 500, bijvoorbeeld. Dus het aantal samples moet niet lineair omhoog gaan maar binnen de perken gehouden worden.

Volgens mij is m’n code net alsnog lineair :') heb in ieder geval een harde limiet van 1000 samples.
Mits floating point numbers geen probleem zijn (eventueel afronden) kun je dat oplossen met een Briggs logaritme.
x = String length
y = Aantal samples
z = Basisaantal samples

log(x) * z = y

Dan krijg je bij een length van 10000 (10^4) 2x zoveel samples als bij een length van 100 (10^2), en bij een length van 1000000 (10^6) 6x zoveel samples.

Hoe je dat in code vertaalt, weet ik niet.
  dinsdag 3 november 2015 @ 18:57:58 #44
12221 Tijn
Powered by MS Paint
pi_157297037
quote:
7s.gif Op dinsdag 3 november 2015 18:28 schreef n8n het volgende:

[..]

Ik wil dat het percentage van samples langzaam omlaag gaat. Dus op 100.000 karakters kunnen er 200 samples gepakt worden, maar met 10.000.000 maar 500, bijvoorbeeld.
Oh, in dat geval is sqrt() wel een goeie, ja :)
  dinsdag 3 november 2015 @ 18:59:05 #45
12221 Tijn
Powered by MS Paint
pi_157297061
quote:
0s.gif Op dinsdag 3 november 2015 18:24 schreef Ser_Ciappelletto het volgende:

[..]

Hij wil het aantal samples doen afnemen naarmate de lengte van de string toeneemt.
Nee, hij wil de groei van het aantal samples doen afnemen.
  dinsdag 3 november 2015 @ 18:59:19 #46
230788 n8n
Pragmatisch
pi_157297067
Hou het denk ik bij sqrt ja, had Math.log() wel gevonden maar dat is een stuk minder straight forward. Thanks. Nu m'n code herschrijven want ik had het eerst niet zo handig aangepast met een hardcoded getal.
Specialization is for insects”.—Robert Heinlein
  dinsdag 3 november 2015 @ 19:04:19 #47
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157297152
quote:
14s.gif Op dinsdag 3 november 2015 18:59 schreef n8n het volgende:
Hou het denk ik bij sqrt ja, had Math.log() wel gevonden maar dat is een stuk minder straight forward. Thanks. Nu m'n code herschrijven want ik had het eerst niet zo handig aangepast met een hardcoded getal.
Met Math.log() kun je het basisgetal wel makkelijker aanpassen als dat nog te groot blijkt.

x = string.length
b = 10 // basisgetal
y = Math.log(x) / Math.log(b) // aantal samples
  dinsdag 3 november 2015 @ 19:06:55 #48
230788 n8n
Pragmatisch
pi_157297197
quote:
0s.gif Op dinsdag 3 november 2015 19:04 schreef Ser_Ciappelletto het volgende:

[..]

Met Math.log() kun je het basisgetal wel makkelijker aanpassen als dat nog te groot blijkt.

x = string.length
b = 10 // basisgetal
y = Math.log(x) / Math.log(b) // aantal samples
Nog een keer naar kijken dan, nu eerst even reactoren anders wordt ik helemaal loco. heb de snippets opgeslagen.

---

edit: refactored, heb een functie die alle afbeeldingen met .glitch indexeert, de binary met ajax ophaalt, dit omzet naar base64 en op een X aantal locaties een karakter wijzigt. Het resultaat wordt naar een callback gegooid waar het verder afgehandeld wordt.

Het is een glitch in de afbeelding, deze heeft nu een X aantal wijzigingen - nu gebaseerd op Math.sqrt() - en elke poging wordt het resultaat met canvas en een load event gecheckt - soms gaan ze kapot of op zwart/grijs. Na elke mislukte poging gaan ook het aantal wijzigingen omlaag om oneindige loops te voorkomen.

Ben er erg content mee O+ En zelfs op m'n telefoon is het erg snel, ook met 1MB afbeeldingen dankzij de Math

Screen: http://d.pr/i/Y38U+

[ Bericht 18% gewijzigd door n8n op 04-11-2015 00:31:22 ]
Specialization is for insects”.—Robert Heinlein
pi_157317752
Ik heb hetzelfde menu (eerdere post in dit topic) nu in <ul> vorm gemaakt. Echter wil het nog steeds niet onder het logo komen te staan. Iemand tips/opmerkingen?
  woensdag 4 november 2015 @ 17:41:41 #50
118011 BrainOverfloW
Fok! around the Clock!
pi_157317792
quote:
0s.gif Op woensdag 4 november 2015 17:39 schreef grotenaz het volgende:
Ik heb hetzelfde menu (eerdere post in dit topic) nu in <ul> vorm gemaakt. Echter wil het nog steeds niet onder het logo komen te staan. Iemand tips/opmerkingen?
Zonder de code zoals je die nu hebt kunnen we weinig zeggen over wat het probleem is.
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_157318584
stijlblad
1
2
3
4
5
6
7
8
.menu {
margin-left: 5%;
background-color: #FFFFFF
list-style-type: none;
}
.logo {
margin-left: 5%;
}

Homepagina:

1
2
3
4
5
6
7
8
9
10
 
<body>
<div class="logo">
<br> <br>
<a href="index.php"> <img src="logo.png" align="left"> <br> <br> </a> </div> 

<div class="menu"> 
<ul> <a href="contact.menu.php"> Contact </ul> </a> 
<ul> <a href="overOns.menu.php"> Over ons </ul> </a>  </div> 
 
pi_157318606
Ik hoop dat jullie kunnen zien waarom het menu naast het logo gaat en niet onder het logo.
pi_157318758
Toevoeging:
Stijlblad
1
2
3
4
 
a.menu {
color: #FFFFFF;
}

De link wordt echter NIET zwart
  woensdag 4 november 2015 @ 18:29:38 #54
230788 n8n
Pragmatisch
pi_157318772
quote:
0s.gif Op woensdag 4 november 2015 18:28 schreef grotenaz het volgende:
Toevoeging:
Stijlblad
[ code verwijderd ]


De link wordt echter NIET zwart
dat is dan ook wit, zwart is #000;
Specialization is for insects”.—Robert Heinlein
pi_157318959
quote:
7s.gif Op woensdag 4 november 2015 18:29 schreef n8n het volgende:

[..]

dat is dan ook wit, zwart is #000;
De link verandert überhaupt niet van kleur.
  woensdag 4 november 2015 @ 18:39:53 #56
56176 Catch22-
Ben je Blind?!
pi_157318991
Gast... Leer eerst hoe HTML werkt. Je code klopt van geen kant.
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_157319061
quote:
1s.gif Op woensdag 4 november 2015 18:38 schreef grotenaz het volgende:

[..]

De link verandert überhaupt niet van kleur.
Dat is verwacht gedrag, de links hebben namelijk niet de class menu. En verder wat Catch22- zegt.
  woensdag 4 november 2015 @ 19:13:41 #58
118011 BrainOverfloW
Fok! around the Clock!
pi_157319716
quote:
0s.gif Op woensdag 4 november 2015 18:19 schreef grotenaz het volgende:
Ik hoop dat jullie kunnen zien waarom het menu naast het logo gaat en niet onder het logo.
Zoals gezegd, er zitten nogal wat beginnersfouten in je HTML:

• Sluit je tags altijd af van binnen naar buiten.
• <br> elementen hebben niks te zoeken binnen een <a> element en zouden sowieso niet gebruikt moeten worden voor het stijlen van de site. Daar is je CSS voor.
• Het zelfde geld voor align=left
• Een unordered list <ul> heeft een lijst van list items <li>. Op zichzelfstaand is een <ul> niet nuttig. Zeker niet meerdere onder elkaar die duidelijk in dezelfde lijst thuis horen.
• Waarom je divs naast elkaar komen te staan heeft te maken met hoe je de elementen in CSS positie geeft ten opzichte van elkaar. Zijn het items op een lijn, zijn het losse blokken etc. Daar is allerlei code voor die je blijkbaar nog moet leren.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<div class="logo">
  <br> <br>
  <a href="index.php"> <img src="logo.png" align="left"> </a>
  <br> <br>
</div> 
<div class="menu"> 
  <ul>
    <li>
      <a href="contact.menu.php"> Contact </a>
    </li>  
    <li> 
     <a href="overOns.menu.php"> Over ons  </a>
    </li>
  </ul>  
</div> 
 

Zelf iets willen maken is een goede manier van toepasselijk leren maar je zult daarnaast ook je kennis bij moeten spijkeren. Als je alleen maar code bij elkaar duwt zonder goed te snappen wat het doet loop je constant tegen problemen aan.

Hopelijk kun je wat met deze tutorial serie: LevelUpTuts - How To Make Your First Website
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
  woensdag 4 november 2015 @ 19:17:29 #59
230788 n8n
Pragmatisch
pi_157319807
codeacademy.com is ook een goede, basics leren in een cursus waar je kleine opdrachten uitvoert.
Specialization is for insects”.—Robert Heinlein
  woensdag 4 november 2015 @ 19:20:51 #60
230788 n8n
Pragmatisch
pi_157319883
Specialization is for insects”.—Robert Heinlein
  woensdag 4 november 2015 @ 19:45:09 #61
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157320480
quote:
14s.gif Op woensdag 4 november 2015 19:17 schreef n8n het volgende:
codeacademy.com is ook een goede, basics leren in een cursus waar je kleine opdrachten uitvoert.
Zo heb ik het ook geleerd. Dat werk je in een weekje door (html, css, js, PHP en MySQL), en dan kun je heel aardig sites maken.
pi_157320616
Bedankt allen, ik heb al 2 jaar niet gecodeerd en wilde weer beginnen. Maar ik heb al een boek bij de boekhandel bestelt om mijn kennis weer op te frissen dus de komende tijd hebben jullie geen last van me😉
  woensdag 4 november 2015 @ 20:00:48 #63
134533 donroyco
dus niet Donroyco
pi_157320809
quote:
0s.gif Op woensdag 4 november 2015 19:50 schreef grotenaz het volgende:
Bedankt allen, ik heb al 2 jaar niet gecodeerd en wilde weer beginnen. Maar ik heb al een boek bij de boekhandel bestelt om mijn kennis weer op te frissen dus de komende tijd hebben jullie geen last van me😉
Ik zou geen boek meer kopen. Online is genoeg te vinden.
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 4 november 2015 @ 20:14:58 #64
230788 n8n
Pragmatisch
pi_157321150
quote:
10s.gif Op woensdag 4 november 2015 20:00 schreef donroyco het volgende:

[..]

Ik zou geen boek meer kopen. Online is genoeg te vinden.
alleen JS: The Good Parts en Don’t Make Me Think
Specialization is for insects”.—Robert Heinlein
  woensdag 4 november 2015 @ 21:09:14 #65
134533 donroyco
dus niet Donroyco
pi_157322792
quote:
14s.gif Op woensdag 4 november 2015 20:14 schreef n8n het volgende:

[..]

alleen JS: The Good Parts en Don’t Make Me Think
Die zijn ook als ebook verschenen ;)
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 4 november 2015 @ 21:11:05 #66
56176 Catch22-
Ben je Blind?!
pi_157322854
quote:
14s.gif Op woensdag 4 november 2015 20:14 schreef n8n het volgende:

[..]

alleen JS: The Good Parts en Don’t Make Me Think
Dont make me think is overrated.
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 4 november 2015 @ 21:34:14 #67
134533 donroyco
dus niet Donroyco
pi_157323663
quote:
1s.gif Op woensdag 4 november 2015 21:11 schreef Catch22- het volgende:

[..]

Dont make me think is overrated.
Overrated? Nee.
Outdated? Ja.
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 4 november 2015 @ 21:38:08 #68
56176 Catch22-
Ben je Blind?!
pi_157323783
quote:
7s.gif Op woensdag 4 november 2015 21:34 schreef donroyco het volgende:

[..]

Overrated? Nee.
Outdated? Ja.
Op zich best zinnig, maar niet altijd even relevant.
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?
  donderdag 5 november 2015 @ 11:13:39 #69
230788 n8n
Pragmatisch
pi_157331444
quote:
1s.gif Op woensdag 4 november 2015 21:11 schreef Catch22- het volgende:

[..]

Dont make me think is overrated.
De principes van don't make me think zijn nog immer relevant, de nieuwe editie gaat ook in op mobiel. De UI wereld heeft geëvolueerd maar de gedachtengang klopt nog steeds, iets wat maar al te duidelijk is als je naar de kwaliteit van software - websites - kijkt.

Overrated tja, het is een boek wat je idereen in de hiërarchie van design/development kan geven om zo de basiskennis te verspreiden. Dat maakt standpunten communiceren wat makkelijker. Het boek staat ook los van de implementatie dus het is nog steeds toe te passen.

Als je The Paradox of Choiche leest kom je er ook achter dat ‘meer opties’ beklemmend werkt voor mensen, dat hele concept wordt in don't make me think toegepast op interface. En zo veel is er - op het Windows 95 uiterlijk na - niet veranderd, veel patronen zijn nog intact na ~30 jaar UI.
Specialization is for insects”.—Robert Heinlein
pi_157433714
Hey FOK!ers,

Ik ben van plan om begin december mezelf beter te leren programmeren. Ik heb al enige ervaringen met HTML en CSS, maar het kan natuurlijk altijd beter!
Ik sta eigenlijk nog in de kinderschoentjes en heb daardoor een heleboel vragen. Dus jullie zullen nog een hoop van mij horen in dit forum :)

Ik programmeerde altijd gewoon in het kladblok met de extensie .html/.css, maar ik zag in dit filmpje dat iemand een ander programma gebruikte waardoor je wat sneller codes kan invoeren. Dit lijkt me super handig! ^O^

Weet iemand hoe dat programma heet? En of het gratis is natuurlijk? :P

Kennen jullie ook goede kanalen op YouTube over programmeren met HTML en CSS?

Alvast bedankt voor het reageren! *O*
pi_157433886
quote:
0s.gif Op maandag 9 november 2015 20:52 schreef BroodmetChocopasta het volgende:
Hey FOK!ers,

Ik ben van plan om begin december mezelf beter te leren programmeren. Ik heb al enige ervaringen met HTML en CSS, maar het kan natuurlijk altijd beter!
Ik sta eigenlijk nog in de kinderschoentjes en heb daardoor een heleboel vragen. Dus jullie zullen nog een hoop van mij horen in dit forum :)

Ik programmeerde altijd gewoon in het kladblok met de extensie .html/.css, maar ik zag in dit filmpje dat iemand een ander programma gebruikte waardoor je wat sneller codes kan invoeren. Dit lijkt me super handig! ^O^

Weet iemand hoe dat programma heet? En of het gratis is natuurlijk? :P

Kennen jullie ook goede kanalen op YouTube over programmeren met HTML en CSS?

Alvast bedankt voor het reageren! *O*
In het filmpje gebruikt hij Notepad++ welke inderdaad gratis. Persoonlijk zou ik dan SublimeText pakken, waarmee je heel lang de demo versie kan draaien. :P
  maandag 9 november 2015 @ 21:00:49 #72
56176 Catch22-
Ben je Blind?!
pi_157433940
quote:
19s.gif Op maandag 9 november 2015 20:58 schreef TwenteFC het volgende:

[..]

In het filmpje gebruikt hij Notepad++ welke inderdaad gratis. Persoonlijk zou ik dan SublimeText pakken, waarmee je heel lang de demo versie kan draaien. :P
Is atom niet ongeveer hetzelfde?
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_157434151
quote:
19s.gif Op maandag 9 november 2015 20:58 schreef TwenteFC het volgende:

[..]

In het filmpje gebruikt hij Notepad++ welke inderdaad gratis. Persoonlijk zou ik dan SublimeText pakken, waarmee je heel lang de demo versie kan draaien. :P
Dankjewel voor je snelle reactie!
  maandag 9 november 2015 @ 21:46:25 #74
91039 mstx
2x1/2 = 1/2 x 1/2
pi_157435661
quote:
1s.gif Op maandag 9 november 2015 21:00 schreef Catch22- het volgende:

[..]

Is atom niet ongeveer hetzelfde?
Nee.

Atom is veel fijner. :)
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
pi_157435827
quote:
1s.gif Op maandag 9 november 2015 21:00 schreef Catch22- het volgende:

[..]

Is atom niet ongeveer hetzelfde?
Heb Atom nog nooit gebruikt dus ik zou het eerlijk gezegd niet weten. SublimeText & PHPStorm zijn eigenlijk mijn enige editors/ide.

quote:
0s.gif Op maandag 9 november 2015 21:46 schreef mstx het volgende:

[..]

Nee.

Atom is veel fijner. :)
Maar eens proberen dan :)
  maandag 9 november 2015 @ 21:53:32 #76
91039 mstx
2x1/2 = 1/2 x 1/2
pi_157435946
quote:
19s.gif Op maandag 9 november 2015 21:50 schreef TwenteFC het volgende:

[..]

Heb Atom nog nooit gebruikt dus ik zou het eerlijk gezegd niet weten. SublimeText & PHPStorm zijn eigenlijk mijn enige editors/ide.

[..]

Maar eens proberen dan :)
Atom haalt het bij lange na niet bij PhpStorm, vooral met PHP code, maarja die is dan ook niet gratis.
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
pi_157515703
Ik ben bezig met een interactieve kaart die de route van MH17 aan geeft en wat er onderweg precies is gebeurd etc. Nu gebruik ik deze code van Mapbox: https://www.mapbox.com/ma(...)ally-drawing-a-line/
Probleem is alleen dat ik echt geen idee heb wat ik moet aanpassen om de lijn van NL naar Oekraine te laten lopen. :? Iemand enig idee? O+
Op donderdag 9 juli 2015 14:53 schreef Yvie_lu: Gelukkig. Paniek om niks :)
Op donderdag 9 juli 2015 14:57 schreef HeatWave: Deze post is universeel toepasbaar bij haar B-).
Op woensdag 8 juli 2015 15:09 schreef El_Thijs:"Inolvidable. Staat voor duidelijkheid en directheid."
  vrijdag 13 november 2015 @ 16:33:53 #78
84244 Scorpie
Abject en infaam!
pi_157515733
quote:
0s.gif Op vrijdag 13 november 2015 16:31 schreef Inolvidable het volgende:
Ik ben bezig met een interactieve kaart die de route van MH17 aan geeft en wat er onderweg precies is gebeurd etc. Nu gebruik ik deze code van Mapbox: https://www.mapbox.com/ma(...)ally-drawing-a-line/
Probleem is alleen dat ik echt geen idee heb wat ik moet aanpassen om de lijn van NL naar Oekraine te laten lopen. :? Iemand enig idee? O+
to use this API, you'll need to understand basic Javascript and mapping concepts. If you'd like to learn Javascript, start with an interactive course or book. To learn more about maps, we've provided a helpful article explaining how web maps work.
Op dinsdag 13 augustus schreef Xa1pt:
Neuh, fraude mag best aangepakt worden. Maar dat het de maatschappij meer oplevert of beter is voor de samenleving, is nog maar de vraag.
Op donderdag 25 juni 2015 schreef KoosVogels:
Klopt. Ik ben een racist.
pi_157515994
quote:
1s.gif Op vrijdag 13 november 2015 16:33 schreef Scorpie het volgende:

[..]

to use this API, you'll need to understand basic Javascript and mapping concepts. If you'd like to learn Javascript, start with an interactive course or book. To learn more about maps, we've provided a helpful article explaining how web maps work.
Dus het is niet een kwestie van coordinaten aanpassen? ;(
Jammer. :'(
Op donderdag 9 juli 2015 14:53 schreef Yvie_lu: Gelukkig. Paniek om niks :)
Op donderdag 9 juli 2015 14:57 schreef HeatWave: Deze post is universeel toepasbaar bij haar B-).
Op woensdag 8 juli 2015 15:09 schreef El_Thijs:"Inolvidable. Staat voor duidelijkheid en directheid."
pi_157532611
quote:
0s.gif Op vrijdag 13 november 2015 16:44 schreef Inolvidable het volgende:
Dus het is niet een kwestie van coordinaten aanpassen? ;(
Jammer. :'(
De lijn wordt door de functie polyline.addLatLng in de add() functie getekend. Je moet dus je coordinaten aan die functie meegeven ipv wat er nu staat. Bijvoorbeeld polyline.addLatLng(L.latLng(52.307,4.767));
pi_157556687
Ik ben bezig om een heel simpel voorraad systeem te bouwen, de PHP en database kant lukt mij makkelijk, maar loop een beetje vast met CSS/jQuery.

Wellicht dat iemand mij kan helpen?

Momenteel heb ik dit

Je kan dus in de zoekveld een product naam invoeren en automatisch wordt de tabel 'bijgewerkt'. Tot zo ver geen probleem.

Wat ik nu nog wil toevoegen is zodra je een amount invult en je klikt op Sell, dan wil dat er een PHP script wordt uitgevoerd die de voorraad aanpaast, deze PHP script zal of een success tekst weergeven of een error. De PHP script kan ik wel maken, maar de success of error tekst moet naast het knopje Sell verschijnen voor 2 seconde en moet meer weggaan.

Daarnaast moet de veld Quantity ook geupdate worden met de nieuwe waarde.

Is bovenstaande mogelijk? Zonder de pagina te hoeven refreshen.

Alle hulp is welkom :)
pi_157557443
quote:
19s.gif Op maandag 9 november 2015 20:58 schreef TwenteFC het volgende:

[..]

In het filmpje gebruikt hij Notepad++ welke inderdaad gratis. Persoonlijk zou ik dan SublimeText pakken, waarmee je heel lang de demo versie kan draaien. :P
Volgens de licentievoorwaarden van Sublime Text moet je wel betalen na de trial periode.
  zaterdag 14 november 2015 @ 23:41:01 #83
118011 BrainOverfloW
Fok! around the Clock!
pi_157558140
quote:
0s.gif Op zaterdag 14 november 2015 23:08 schreef Light het volgende:

[..]

Volgens de licentievoorwaarden van Sublime Text moet je wel betalen na de trial periode.
Klopt, maar die trail periode is oneindig. Het enige wat je krijgt is om de zoveel keer opslaan de vraag of je een licentie aan wilt schaffen.
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_157559067
quote:
0s.gif Op zaterdag 14 november 2015 23:41 schreef BrainOverfloW het volgende:

[..]

Klopt, maar die trail periode is oneindig. Het enige wat je krijgt is om de zoveel keer opslaan de vraag of je een licentie aan wilt schaffen.
Yep, maar je kunt je wel afvragen of je nog wel bezig bent met een evaluatie.
quote:
Sublime Text 2 may be downloaded and evaluated for free, however a license must be purchased for continued use. There is currently no enforced time limit for the evaluation.
  zondag 15 november 2015 @ 00:17:32 #85
56176 Catch22-
Ben je Blind?!
pi_157559143
Er was toch ook zo'n editor die alles in comic sans deed na de trial periode?

Ik werk op werk in netbeans omdat we onze Java projecten daarin doen. Maar moet nu wat anders vinden omdat netbeans es6 syntaxes niet kent.
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_157559484
quote:
0s.gif Op zaterdag 14 november 2015 22:34 schreef xaban06 het volgende:
Ik ben bezig om een heel simpel voorraad systeem te bouwen, de PHP en database kant lukt mij makkelijk, maar loop een beetje vast met CSS/jQuery.

Wellicht dat iemand mij kan helpen?

Momenteel heb ik dit

Je kan dus in de zoekveld een product naam invoeren en automatisch wordt de tabel 'bijgewerkt'. Tot zo ver geen probleem.

Wat ik nu nog wil toevoegen is zodra je een amount invult en je klikt op Sell, dan wil dat er een PHP script wordt uitgevoerd die de voorraad aanpaast, deze PHP script zal of een success tekst weergeven of een error. De PHP script kan ik wel maken, maar de success of error tekst moet naast het knopje Sell verschijnen voor 2 seconde en moet meer weggaan.

Daarnaast moet de veld Quantity ook geupdate worden met de nieuwe waarde.

Is bovenstaande mogelijk? Zonder de pagina te hoeven refreshen.

Alle hulp is welkom :)
Om te beginnen, zorg dat de id's uniek zijn bij de invoervelden voor aantallen (of haal ze gewoon helemaal weg, ze hebben zo te zien geen toegevoegde waarde).

Ik heb je code wat uitgebreid en de eerste "Sell" button triggert nu een functie die de rij waar de knop in staat in de console weergeeft. Daar kun je vast verder mee komen. Er zijn een paar mogelijke oplossingen.

Ik zou waarschijnlijk voor een oplossing kiezen met een json response, waarbij je een http 200-status krijgt met in de json een succes-melding, of een http 4xx-status en een foutmelding. Dan moet je bij succes alsnog de getallen bijwerken, maar dat kan omdat je het oorspronkelijke getal hebt en het bestelde aantal. Dan wordt het makkelijk uitrekenen. Je kunt ook het nieuwe aantal meesturen, dat heeft als voordeel dat je meteen de status corrigeert voor het geval iemand anders (of jij, in een andere browser) ook acties uitvoert.
  zondag 15 november 2015 @ 00:32:40 #87
230788 n8n
Pragmatisch
pi_157559559
quote:
1s.gif Op zondag 15 november 2015 00:17 schreef Catch22- het volgende:
Er was toch ook zo'n editor die alles in comic sans deed na de trial periode?

Ik werk op werk in netbeans omdat we onze Java projecten daarin doen. Maar moet nu wat anders vinden omdat netbeans es6 syntaxes niet kent.
Chocolat.app. Heb het aangeschaft maar zou het niet aanraden. Het werkt op papier perfect maar zit vol glitches en bugs die langzaam opgelost worden. Code completion werkt soms niet, of de syntax wordt niet gekleurd, of de regelafstand vliegt alle kanten op, of het reageert tijdelijk nergens op.

Mocht je deze bugs niet hebben, de autocomplete met documentatie is wel superchill.

Toch hou ik er star aan vast omdat ik perse een native app wil :') en coda vond ik inhoudelijk waardeloos. Had de Textmate beta nog geprobeerd maar dat was nog te beta (sloom, loopt vast).

Mocht iemand een tip hebben, zoek een native test editor voor Mac 😀
Specialization is for insects”.—Robert Heinlein
pi_157559807
quote:
1s.gif Op zondag 15 november 2015 00:17 schreef Catch22- het volgende:
Er was toch ook zo'n editor die alles in comic sans deed na de trial periode?

Ik werk op werk in netbeans omdat we onze Java projecten daarin doen. Maar moet nu wat anders vinden omdat netbeans es6 syntaxes niet kent.
Eclipse? Al heb ik geen idee wat de huidige status van dat project is.
Anders eens naar IntelliJ IDEA kijken. Niet gratis, wel goed (imo).
  zondag 15 november 2015 @ 00:49:30 #89
56176 Catch22-
Ben je Blind?!
pi_157559906
quote:
0s.gif Op zondag 15 november 2015 00:43 schreef Light het volgende:

[..]

Eclipse? Al heb ik geen idee wat de huidige status van dat project is.
Anders eens naar IntelliJ IDEA kijken. Niet gratis, wel goed (imo).
Eclipse is echt heel kut en traag imo. IntelliJ hebben we wel naar gekeken geloof ik, ook omdat ze (de backenders) met Scala bezig gaan en het framework IntelliJ als main-ide gebruikt.

Ik ga even met Atom stoeien
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?
  zondag 15 november 2015 @ 01:10:22 #90
230788 n8n
Pragmatisch
pi_157560264
Atom is vrij sloom, dan was brackets dacht ik beter.
Specialization is for insects”.—Robert Heinlein
pi_157561145
quote:
0s.gif Op zaterdag 14 november 2015 23:08 schreef Light het volgende:

[..]

Volgens de licentievoorwaarden van Sublime Text moet je wel betalen na de trial periode.
Klopt maar zoals eerder gezegd, een melding weg klikken is genoeg om het te blijven gebruiken.

Zelf betaal ik er meestal gewoon voor als ik het een handige tool vind, en op het werk laat ik de baas lekker betalen.
  zondag 15 november 2015 @ 18:30:30 #92
230788 n8n
Pragmatisch
pi_157573579
1( average <= 8 || average === 128 ? start() : callback(image) );

dit mag niet van JSHint: W030 Expected an assignment or function call but instead saw an expression.

Er staan toch 2 function calls dit dat

[ Bericht 9% gewijzigd door n8n op 15-11-2015 18:38:14 ]
Specialization is for insects”.—Robert Heinlein
pi_157573791
quote:
9s.gif Op zondag 15 november 2015 18:30 schreef n8n het volgende:

[ code verwijderd ]

dit mag niet van JSHint: W030 Expected an assignment or function call but instead saw an expression.

Er staan toch 2 function calls dit dat
Ik zou wat haakjes toevoegen:
1( (average <= 8 || average === 128) ? start() : callback(image) );
  zondag 15 november 2015 @ 18:46:46 #94
230788 n8n
Pragmatisch
pi_157573927
quote:
0s.gif Op zondag 15 november 2015 18:40 schreef Light het volgende:

[..]

Ik zou wat haakjes toevoegen:
[ code verwijderd ]

al gedaan maar de 'error' blijft. De code werkt verder wel naar verwachting.

edit: dan maar zo
1if ( average <= 8 || average === 128 ) start(); else callback(image);


[ Bericht 24% gewijzigd door n8n op 17-11-2015 14:19:41 ]
Specialization is for insects”.—Robert Heinlein
pi_157645548
:P Over 30 uur wordt Foundation 6 gelanceerd.
http://zurb.com/article/1415/48-hour-countdown-to-foundation-6

Was wel benieuwd eigenlijk wat jullie van Foundation vinden t.o.v. bijv. Bootstrap?
Of mis ik dan nog "betere" frameworks? Mijn focus en interesse ligt niet zo zeer op de frontend dus daarom ben ik wel benieuwd naar meningen van mensen welke hier hele dagen aan werken.

Grootste verschil wat ik eigenlijk merk, heel zwart/wit, is dat je met Foundation je eigen designer moet meebrengen.
pi_157770977
Ik word helemaal gek van het feit dat als ik probeer te googlen hoe iets in javascript werkt dat het enige wat je tegenwoordig nog krijgt is jquery rommel wat ze dan ook gewoon doodleuk javascript durven te noemen, ik wil er niks mee te maken hebben.

Maar kan iemand mij vertellen hoe ik met javascript (dus niet jquery!) een handeling kan uitvoeren op het moment dat de bovenkant van de browser de bovenkant van een bepaalde div aanraakt?
  maandag 23 november 2015 @ 20:45:15 #97
56176 Catch22-
Ben je Blind?!
pi_157771159
quote:
0s.gif Op maandag 23 november 2015 20:38 schreef Skunk-m het volgende:
Ik word helemaal gek van het feit dat als ik probeer te googlen hoe iets in javascript werkt dat het enige wat je tegenwoordig nog krijgt is jquery rommel wat ze dan ook gewoon doodleuk javascript durven te noemen, ik wil er niks mee te maken hebben.

Maar kan iemand mij vertellen hoe ik met javascript (dus niet jquery!) een handeling kan uitvoeren op het moment dat de bovenkant van de browser de bovenkant van een bepaalde div aanraakt?
Jquery is ook JavaScript.

Maar onscroll de windowX aftesten tegenover de top van de div.
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_157772670
quote:
1s.gif Op maandag 23 november 2015 20:45 schreef Catch22- het volgende:

[..]

Jquery is ook JavaScript.

Maar onscroll de windowX aftesten tegenover de top van de div.
Dat word omgezet in javascript ja door een lang script waarin jquery word gemaakt of zoiets..

Maar ik heb het nou gefixt met offsetTop en window.scrollY
Als je beetje kijkt zijn die jquery dingen die je vind nog wel enigzins te gebruiken om de javascript dingen te vinden.
  maandag 23 november 2015 @ 21:40:56 #99
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157773215
quote:
0s.gif Op maandag 23 november 2015 21:27 schreef Skunk-m het volgende:

[..]

Dat word omgezet in javascript ja door een lang script waarin jquery word gemaakt of zoiets..

Maar ik heb het nou gefixt met offsetTop en window.scrollY
Als je beetje kijkt zijn die jquery dingen die je vind nog wel enigzins te gebruiken om de javascript dingen te vinden.
Nee, jQuery zijn gewoon pre-made Javascript-functies.
pi_157773526
quote:
0s.gif Op maandag 23 november 2015 21:40 schreef Ser_Ciappelletto het volgende:

[..]

Nee, jQuery zijn gewoon pre-made Javascript-functies.
Ja dat zeg ik..
  maandag 23 november 2015 @ 22:05:01 #101
56176 Catch22-
Ben je Blind?!
pi_157774056
quote:
0s.gif Op maandag 23 november 2015 21:49 schreef Skunk-m het volgende:

[..]

Ja dat zeg ik..
Bijna iedereen gebruikt jquery. Je hebt namelijk makkelijker leesbare code met betere crossplatform ondersteuning. Kost je iets performance als je zelf onwijs gaat optimaliseren, maar dat is allemaal marginaal.
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_157776790
quote:
1s.gif Op maandag 23 november 2015 20:45 schreef Catch22- het volgende:

[..]

Jquery is ook JavaScript.
jQuery is een framework/library geschreven in de taal Javascript. Dat maakt het twee verschillende dingen.
  maandag 23 november 2015 @ 23:55:30 #103
230788 n8n
Pragmatisch
pi_157777036
quote:
1s.gif Op maandag 23 november 2015 22:05 schreef Catch22- het volgende:

[..]

Bijna iedereen gebruikt jquery. Je hebt namelijk makkelijker leesbare code met betere crossplatform ondersteuning. Kost je iets performance als je zelf onwijs gaat optimaliseren, maar dat is allemaal marginaal.
JS is prima leesbaar. jQuery is merkbaar vertragend en gebruikt settimeout voor scroll events ipv RAF. 1kb kost ruwweg 1ms om te parsen en jQuery is 87kb ofzo. Dat vind ik behoorlijk wat na alle andere zaken die vertragen.
Specialization is for insects”.—Robert Heinlein
pi_157778737
quote:
1s.gif Op maandag 23 november 2015 22:05 schreef Catch22- het volgende:

[..]

Bijna iedereen gebruikt jquery. Je hebt namelijk makkelijker leesbare code met betere crossplatform ondersteuning. Kost je iets performance als je zelf onwijs gaat optimaliseren, maar dat is allemaal marginaal.
Een snelheidsvergelijking tussen document.getElementById('foo') en $('#foo'):
http://jsperf.com/getelementbyid-vs-jquery-id/180

Tip: probeer die test ook eens andere browsers.
  dinsdag 24 november 2015 @ 09:17:55 #105
56176 Catch22-
Ben je Blind?!
pi_157779364
quote:
0s.gif Op dinsdag 24 november 2015 08:14 schreef Light het volgende:

[..]

Een snelheidsvergelijking tussen document.getElementById('foo') en $('#foo'):
http://jsperf.com/getelementbyid-vs-jquery-id/180

Tip: probeer die test ook eens andere browsers.
Ja, met zoveel iteraties ofzo merk je het wel.
quote:
1s.gif Op maandag 23 november 2015 23:55 schreef n8n het volgende:

[..]

JS is prima leesbaar. jQuery is merkbaar vertragend en gebruikt settimeout voor scroll events ipv RAF. 1kb kost ruwweg 1ms om te parsen en jQuery is 87kb ofzo. Dat vind ik behoorlijk wat na alle andere zaken die vertragen.
Dat klopt.

Mijn invalshoek is iets anders denk ik. Ik werk voor klanten die graag enige vorm van efficientie in bouw willen. Ik weet zeker dat als je goed en gestructureerd werkt met jQuery dat je echt niet merkbaar vertraging gaat krijgen in webapps. Het gaat wel uitmaken als je animatie-dependend websites maakt.

Ik werk nu veel met AngularJS en dat is ook niet super-performant, maar ik kan er wel erg snel mee developen en de vertraging in de UI is voor de gebruiker niet merkbaar.

Alles draait om een efficiente dom en efficiente code.
Het is altijd een afweging tussen developmenttijd en performance. Als je zelf een Proof of Concept doet en infinite tijd hebt is het heel leuk als je uren bezig kan zijn om ms van je render af te snoepen. En reallife situaties kan dat simpelweg niet uit.
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 25 november 2015 @ 09:55:37 #106
230788 n8n
Pragmatisch
pi_157805014
Met een webapp laadt en parse je al je assets als het goed is maar eenmalig, op dom updates en events na. Dan is wat laadtijd wel te doen.

Een website is niks meer dan een simpel documentje dus dan vind ik zware libraries onzin. Al die react/angular/ajax driven webpagina-navigatie vind ik ook altijd kut omdat de state niet lekker in de historie staat waardoor tussen pagina's navigeren (terug/vooruit) altijd butje is. Het kan wel, maar de praktijk wijst meestal anders uit.

Bij mijn projecten past vrijwel altijd de html, css en JS in 16kb gzipped, de css en JS zet ik dan ook mooi embedded. Afbeeldingen hebben een placeholder (kleur) dus meestal staat de volledige layout binnen 250ms voor je neus.

[ Bericht 0% gewijzigd door n8n op 25-11-2015 13:55:23 ]
Specialization is for insects”.—Robert Heinlein
pi_157807201
Het is natuurlijk gewoon makkelijker en efficiënter om een framework in je project te knallen dat al het 'zware werk' voor je doet. Natuurlijk kan ik zelf een functie gaan schrijven om AJAX-requests af te handelen, maar waarom zou ik dat doen als de goede mensen van jQuery - en dat zijn echt betere programmeurs dan ik ben :P - al een implementatie hebben gemaakt die door miljoenen mensen wordt gebruikt? Zelfde met data binding. Zou ik vast zelf kunnen maken, maar kost me uren/dagen. KnockoutJS en AngularJS doen dat gewoon veel beter dan ik.

Tuurlijk zijn er ook genoeg nadelen. Performance gaat erop achteruit (hoewel je je zeker niet blind moet staren op benchmarks, real world performance is het enige dat telt), en als je een of andere edge case tegenkomt en tegen bugs aan loopt ben je overgeleverd aan de grillen van de maker van het framework. Als je eigen code niet werkt heb je óók een probleem, maar dat is makkelijker te fixen :P

Het is, zoals Catch22 ook zegt, een afweging. Mijn baas wordt niet blij als ik anderhalf keer zo lang over een project doe omdat ik zo nodig alles zelf moet gaan zitten maken terwijl het er kwalitatief niet aantoonbaar beter van wordt :P Die heeft geen boodschap aan mijn mooie zelfgemaakte functies.
"You wanna be bald? Do what I did: wait a while. In the meantime, there is no excuse for running around looking like a freshly circumcised dick."
pi_157808035
Er is niks mis met het gebruiken van een framework, als je er maar nette code mee schrijft. Te vaak zie ik nog (en echt niet alleen van beginners, ook van grote bureaus) gare jQuery-code met van alles keihard in de Javascript gezet (strings, id's van elementen, URL's etc), geen namespacing, meerdere document-ready's, anonieme functies die gebind worden etc etc. Javascript is al een taal waar je heel makkelijk 'slechte' code mee kunt schrijven en een framework als jQuery maakt dat nog 10x makkelijker.
Bleuh.
  woensdag 25 november 2015 @ 13:58:46 #109
230788 n8n
Pragmatisch
pi_157809871
Ajax was alleen ff kak omdat IE dwars lag. Je hebt ook micro.js of 140medly wat zeer kleine libraries zijn voor die basic dingen die je 20 keer nodig hebt.
Specialization is for insects”.—Robert Heinlein
pi_157811604
Die laadtijd discussie is sowieso krom. De kans dat iemand op jouw website komt die nog nooit een website met jQuery of AngularJS gezien heeft, is nihil. Als je gewoon de bekende CDN's gebruikt staat dat framework dus al lang en breed in zijn cache, misschien zelfs wel precompiled? Dik kans dus dat een jQuery functie aanroepen in de praktijk nog sneller is dan je eigen functie aanroepen die eerst nog van jouw webserver gehaald moet worden.
pi_157812335
quote:
1s.gif Op woensdag 25 november 2015 13:58 schreef n8n het volgende:
Ajax was alleen ff kak omdat IE dwars lag. Je hebt ook micro.js of 140medly wat zeer kleine libraries zijn voor die basic dingen die je 20 keer nodig hebt.
:? Maar niemand dwingt je toch om IE in deze te gebruiken als je andere alternatieven voorhanden hebt?
  woensdag 25 november 2015 @ 16:27:28 #112
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157813297
quote:
15s.gif Op woensdag 25 november 2015 15:46 schreef Iwanius het volgende:

[..]

:? Maar niemand dwingt je toch om IE in deze te gebruiken als je andere alternatieven voorhanden hebt?
Maar sommige van je users gebruiken wellicht wel (een verouderde versie van) IE.
pi_157813358
Tja, zeg dat tegen de klanten :P Als je voor een bedrijf aan de slag gaat dan kom je niet weg met "dan moet je maar een fatsoenlijke browser gebruiken", het spul dat je maakt moet gewoon goed werken in de versie van IE die ze op dat moment draaien. Al moet ik zeggen dat zelfs de meest trage organisaties die ik ken allemaal wel minimaal IE9 hebben tegenwoordig, de meeste 10 of zelfs 11. En daar valt allemaal goed voor te ontwikkelen, alleen IE8 is echt een draak van een ding.

CDN's durf ik trouwens nooit echt op te vertrouwen. Ik zal wel lichtelijk paranoïde zijn, maar wie weet hoe lang je klant jouw product wil blijven gebruiken, en wie weet wat er met zo'n CDN gebeurt in de toekomst? Ik lever frameworks altijd gewoon mee, dan moeten ze maar eenmalig een paar honderd kB méér downloaden. Better to be safe than sorry. Ik heb ook al eens meegemaakt dat de klant de CDN van Google, nota bene, gewoon doodleuk blokkeerde :D Heel het product lag op zijn gat, want het prachtige Dojo framework waar het op gebaseerd is kon niet worden geladen. En dan kun je gaan lopen steggelen met de IT-afdeling en ben je weer dagen verder voordat ze hun firewall hebben aangepast, terwijl het humeur van de klant langzaam tot onder het vriespunt zakt :+
"You wanna be bald? Do what I did: wait a while. In the meantime, there is no excuse for running around looking like a freshly circumcised dick."
  woensdag 25 november 2015 @ 17:01:49 #114
230788 n8n
Pragmatisch
pi_157814172
quote:
15s.gif Op woensdag 25 november 2015 15:46 schreef Iwanius het volgende:

[..]

:? Maar niemand dwingt je toch om IE in deze te gebruiken als je andere alternatieven voorhanden hebt?
Gebruik ik ook niet, ondersteun sowieso niks <IE9, ga me niet door achterlijke bochten wringen.
Specialization is for insects”.—Robert Heinlein
pi_157816809
quote:
7s.gif Op woensdag 25 november 2015 17:01 schreef n8n het volgende:

[..]

Gebruik ik ook niet, ondersteun sowieso niks <IE9, ga me niet door achterlijke bochten wringen.
:P Zelfs Microsoft zelf ondersteunt IE8 in ieder geval niet meer op hun eigen website kwam ik gister achter.
  woensdag 25 november 2015 @ 20:10:47 #116
56176 Catch22-
Ben je Blind?!
pi_157818957
quote:
7s.gif Op woensdag 25 november 2015 17:01 schreef n8n het volgende:

[..]

Gebruik ik ook niet, ondersteun sowieso niks <IE9, ga me niet door achterlijke bochten wringen.
Voordeel van bedrijfsautomatisering : je kan klanten de optie geven.

Support voor oude meuk
Klaar voor de toekomst

Kiezen ze vaak het tweede.
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_157819047
quote:
1s.gif Op woensdag 25 november 2015 20:10 schreef Catch22- het volgende:

[..]

Voordeel van bedrijfsautomatisering : je kan klanten de optie geven.

Support voor oude meuk
Klaar voor de toekomst

Kiezen ze vaak het tweede.
:P Zit hem vooral ook in de manier van uitleggen richting de klant/werkgever inderdaad.

Zit nogal een verschil tussen:

1. "We sluiten nu X% van onze klanten uit omdat we ze niet ondersteunen. Wil jij hier geld in steken?"
2. "X% van onze klanten loopt nog fors achter qua browserupdates, maar volgens de statistieken daalt dit aantal best snel. Wil jij hier geld in steken?"
  woensdag 25 november 2015 @ 20:23:23 #118
56176 Catch22-
Ben je Blind?!
pi_157819257
quote:
19s.gif Op woensdag 25 november 2015 20:15 schreef TwenteFC het volgende:

[..]

:P Zit hem vooral ook in de manier van uitleggen richting de klant/werkgever inderdaad.

Zit nogal een verschil tussen:

1. "We sluiten nu X% van onze klanten uit omdat we ze niet ondersteunen. Wil jij hier geld in steken?"
2. "X% van onze klanten loopt nog fors achter qua browserupdates, maar volgens de statistieken daalt dit aantal best snel. Wil jij hier geld in steken?"
ik werk met gecontroleerde omgevingen natuurlijk, dat scheelt. Als de klant overal chrome, Firefox, edge of andere nieuwe browsers kan installeren is dat dus geen issue.
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_157819465
quote:
1s.gif Op woensdag 25 november 2015 20:23 schreef Catch22- het volgende:

[..]

ik werk met gecontroleerde omgevingen natuurlijk, dat scheelt. Als de klant overal chrome, Firefox, edge of andere nieuwe browsers kan installeren is dat dus geen issue.
Die luxe heb ik dan niet, maar uitzonderingen daargelaten en mits het geen specifieke vereiste is gaan wij sowieso niet meer optimaliseren voor verouderde browsers. Als blijkt dat het in IE8 een grote bende is dan laten wij het lekker zo. Het is de investering vaak toch niet meer waard.

Een grote melding in beeld met een link naar Chrome & Firefox en dat is dat.
  woensdag 25 november 2015 @ 22:31:04 #120
230788 n8n
Pragmatisch
pi_157823728
quote:
14s.gif Op woensdag 25 november 2015 15:17 schreef KomtTijd... het volgende:
Die laadtijd discussie is sowieso krom. De kans dat iemand op jouw website komt die nog nooit een website met jQuery of AngularJS gezien heeft, is nihil. Als je gewoon de bekende CDN's gebruikt staat dat framework dus al lang en breed in zijn cache, misschien zelfs wel precompiled? Dik kans dus dat een jQuery functie aanroepen in de praktijk nog sneller is dan je eigen functie aanroepen die eerst nog van jouw webserver gehaald moet worden.
die vergelijking klopt niet helemaal want in beide gevallen heb je applicatiecode, die van jQuery is potentieel korter, native waarschijnlijk sneller uitgevoerd. Daarnaast is er een wildgroei aan jq versies en cdn’s.

Onder de streep is het allemaal wel prima, afhankelijk van de ‘requirements’ en voorkeur.

[ Bericht 5% gewijzigd door n8n op 25-11-2015 22:43:15 ]
Specialization is for insects”.—Robert Heinlein
pi_157824670
quote:
11s.gif Op dinsdag 24 november 2015 09:17 schreef Catch22- het volgende:

[..]

Ja, met zoveel iteraties ofzo merk je het wel.
Het laat wel zien dat het maken van een jQuery object een 'dure' actie is, en dat het dus slim is om die objecten te hergebruiken. En je kunt die snelheden ook in verschillende browsers vergelijken (en zien dat Firefox veel sneller is, zeker als het aankomt op document.getElementById())
  woensdag 25 november 2015 @ 23:11:07 #122
230788 n8n
Pragmatisch
pi_157824862
Sowieso al je variabele in de lokale scope cachen, ook -zeker- in libraries.
Specialization is for insects”.—Robert Heinlein
  donderdag 26 november 2015 @ 09:18:07 #123
56176 Catch22-
Ben je Blind?!
pi_157829018
quote:
0s.gif Op woensdag 25 november 2015 23:03 schreef Light het volgende:

[..]

Het laat wel zien dat het maken van een jQuery object een 'dure' actie is, en dat het dus slim is om die objecten te hergebruiken. En je kunt die snelheden ook in verschillende browsers vergelijken (en zien dat Firefox veel sneller is, zeker als het aankomt op document.getElementById())
Ja dat sowieso. Maar dat is gewoon common sense imo. Als je geen idee hebt wat je precies aan het doen bent, kan je vanilla js ook sloom maken
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?
  donderdag 26 november 2015 @ 16:31:24 #124
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157836854
Kun je met een .innerHTML() of .html()-functie geen text in een <input type="text"> dingetje zetten? In een <textarea> werkt het wel.
  donderdag 26 november 2015 @ 16:34:52 #125
56176 Catch22-
Ben je Blind?!
pi_157836916
quote:
0s.gif Op donderdag 26 november 2015 16:31 schreef Ser_Ciappelletto het volgende:
Kun je met een .innerHTML() of .html()-functie geen text in een <input type="text"> dingetje zetten? In een <textarea> werkt het wel.
Die heeft een .value property.
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?
  donderdag 26 november 2015 @ 16:37:22 #126
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157836979
quote:
11s.gif Op donderdag 26 november 2015 16:34 schreef Catch22- het volgende:

[..]

Die heeft een .value property.
Ja, weet ik. Maar die value kan ik dus niet aanpassen met .innerhtml()? Is daar een andere manier voor?

Op zich is <textarea> gebruiken geen groot probleem, het ziet er gewoon minder netjes uit.
  donderdag 26 november 2015 @ 16:38:27 #127
56176 Catch22-
Ben je Blind?!
pi_157837001
quote:
0s.gif Op donderdag 26 november 2015 16:37 schreef Ser_Ciappelletto het volgende:

[..]

Ja, weet ik. Maar die value kan ik dus niet aanpassen met .innerhtml()? Is daar een andere manier voor?

Op zich is <textarea> gebruiken geen groot probleem, het ziet er gewoon minder netjes uit.
dan check je toch de tagName even?
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?
  donderdag 26 november 2015 @ 16:55:10 #128
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157837350
quote:
11s.gif Op donderdag 26 november 2015 16:38 schreef Catch22- het volgende:

[..]

dan check je toch de tagName even?
Juist. Met document.getElementById("element").value = "whatever" lukt het wel. Bedankt voor de hulp. ;)
pi_157845151
quote:
11s.gif Op donderdag 26 november 2015 09:18 schreef Catch22- het volgende:

[..]

Ja dat sowieso. Maar dat is gewoon common sense imo. Als je geen idee hebt wat je precies aan het doen bent, kan je vanilla js ook sloom maken
Ik heb genoeg code gezien waarbij dingen die common sense zouden moeten zijn dat toch niet blijken te zijn.

Het helpt overigens wel als je een IDE gebruikt die je vertelt wat je aan niet-gebruikte variabelen hebt en waar je dingen kunt optimaliseren.
  donderdag 26 november 2015 @ 21:17:31 #130
230788 n8n
Pragmatisch
pi_157845407
Sowieso in JSHint/Lint handig, ongebruikte variabelen zou de ugliefier er uit moeten vissen.
Specialization is for insects”.—Robert Heinlein
pi_157846754
quote:
1s.gif Op donderdag 26 november 2015 21:17 schreef n8n het volgende:
Sowieso in JSHint/Lint handig, ongebruikte variabelen zou de ugliefier er uit moeten vissen.
Dat een uglifier die variabelen er alsnog uit haalt, is maar de helft van de oplossing. Als ik die code later bekijk/bewerk, pak ik namelijk de normale versie en daar staat die variabele nog steeds in.

Dat je tijdens development ongebruikte variabelen hebt, snap ik heel goed. Maar voordat je iets 'af' kunt noemen, moeten ze wel weg zijn. Ongeacht de programmeertaal die je gebruikt. Overigens meldt jshint unused variables ook.
  maandag 30 november 2015 @ 16:01:27 #132
91039 mstx
2x1/2 = 1/2 x 1/2
pi_157923212
Over optimalisatie gesproken, ik kwam laatst deze site tegen
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.
200 requests op de homepage, 1.9MB aan javascriptbestanden, 1.7MB aan css en 4MB aan svg's _O_
Dat logo bovenin is 1MB :') _____!
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
  maandag 30 november 2015 @ 16:20:11 #133
230788 n8n
Pragmatisch
pi_157923589
quote:
0s.gif Op maandag 30 november 2015 16:01 schreef mstx het volgende:
Over optimalisatie gesproken, ik kwam laatst deze site tegen
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.
200 requests op de homepage, 1.9MB aan javascriptbestanden, 1.7MB aan css en 4MB aan svg's _O_
Dat logo bovenin is 1MB :') _____!
Dat is tegenwoordig de norm. Hebben we hier een discussie over jQuery terwijl die social button plug-ins met like indicatie easy 500kb binnenhalen met 20 requests :') Helemaal van de zotte wanneer je bedenkt dat die zooi van Twitter, Google, en Facebook komt, zogenaamd pro-optimalisatie.

http://www.webperformance(...)b-page-1795-kb-size/

En Light, ben het dan ook helemaal met je eens.
Specialization is for insects”.—Robert Heinlein
  maandag 30 november 2015 @ 16:21:58 #134
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157923624
quote:
0s.gif Op maandag 30 november 2015 16:01 schreef mstx het volgende:
Over optimalisatie gesproken, ik kwam laatst deze site tegen
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.
200 requests op de homepage, 1.9MB aan javascriptbestanden, 1.7MB aan css en 4MB aan svg's _O_
Dat logo bovenin is 1MB :') _____!
Dat is zodat het logo er nog steeds goed uitziet voor de mensen met een scherm van 4000x5000px.

Anyhow, wat gebruik jij om te zien hoeveel requests/js-bestanden/etc. zo'n pagina gebruikt?
  maandag 30 november 2015 @ 16:28:33 #135
230788 n8n
Pragmatisch
pi_157923754
De inspector kan dat en anders heb je extensies als yslow.

De rest van de foto's is trouwens 1 grote pixelbrij, dus alleen het - SVG potentiële - logo is voor 2015 schermen :')
Specialization is for insects”.—Robert Heinlein
  maandag 30 november 2015 @ 16:30:08 #136
91039 mstx
2x1/2 = 1/2 x 1/2
pi_157923781
quote:
0s.gif Op maandag 30 november 2015 16:21 schreef Ser_Ciappelletto het volgende:

[..]

Dat is zodat het logo er nog steeds goed uitziet voor de mensen met een scherm van 4000x5000px.
Het hele idee van SVG is toch dat je een hele kleine vectorafbeelding van een paar kB hebt die je oneindig kan schalen? :P

quote:
Anyhow, wat gebruik jij om te zien hoeveel requests/js-bestanden/etc. zo'n pagina gebruikt?
Gewoon de standaard developer tools (F12) van firefox/chrome
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
  maandag 30 november 2015 @ 16:34:07 #137
134533 donroyco
dus niet Donroyco
pi_157923858
quote:
0s.gif Op maandag 30 november 2015 16:01 schreef mstx het volgende:
Over optimalisatie gesproken, ik kwam laatst deze site tegen
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.
200 requests op de homepage, 1.9MB aan javascriptbestanden, 1.7MB aan css en 4MB aan svg's _O_
Dat logo bovenin is 1MB :') _____!
Een stap terug zou het design al zijn afgeschoten door een kundige UX'er.
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. :'(
  maandag 30 november 2015 @ 16:36:40 #138
230788 n8n
Pragmatisch
pi_157923905
quote:
7s.gif Op maandag 30 november 2015 16:34 schreef donroyco het volgende:

[..]

Een stap terug zou het design al zijn afgeschoten door een kundige UX'er.
Kundige UX-ers vind je niet bij de goedkope wordpress studio die 20 van zulke sites per jaar knalt en alleen naar awwwards themeforrest kijken wat een beetje gangbaar is.
Specialization is for insects”.—Robert Heinlein
  maandag 30 november 2015 @ 16:40:53 #139
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_157924003
quote:
7s.gif Op maandag 30 november 2015 16:34 schreef donroyco het volgende:

[..]

Een stap terug zou het design al zijn afgeschoten door een kundige UX'er.
N00b-vraag: wat zijn nou de grootste doodzondes die op deze site begaan zijn, die een kundige UX'er nooit zou maken?
  maandag 30 november 2015 @ 16:47:31 #140
56176 Catch22-
Ben je Blind?!
pi_157924137
quote:
0s.gif Op maandag 30 november 2015 16:40 schreef Ser_Ciappelletto het volgende:

[..]

N00b-vraag: wat zijn nou de grootste doodzondes die op deze site begaan zijn, die een kundige UX'er nooit zou maken?
Witte tekst op een gele achtergrond for starters...
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?
  maandag 30 november 2015 @ 17:01:10 #141
12221 Tijn
Powered by MS Paint
pi_157924398
quote:
11s.gif Op maandag 30 november 2015 16:47 schreef Catch22- het volgende:

[..]

Witte tekst op een gele achtergrond for starters...
Inderdaad zeg, het contrast op die pagina is echt bizar slecht.

Die footer ook, met een gele link op een lichtgrijze achtergrond _O-
  maandag 30 november 2015 @ 17:46:22 #142
134533 donroyco
dus niet Donroyco
pi_157925323
quote:
0s.gif Op maandag 30 november 2015 16:40 schreef Ser_Ciappelletto het volgende:

[..]

N00b-vraag: wat zijn nou de grootste doodzondes die op deze site begaan zijn, die een kundige UX'er nooit zou maken?
Contrast ratio zoals Catch22- en Tijn al aangeven.
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. :'(
  maandag 30 november 2015 @ 18:03:38 #143
56176 Catch22-
Ben je Blind?!
pi_157925647
En hij werkt niet zonder www...
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_157928080
Iemand enig idee waarom pagina 1 wel speciale tekens (zoals é en ¤) weergeeft, maar pagina 2 totaal niet? Ze zijn beiden aan hetzelfde css-bestand verbonden en verder zit er eigenlijk geen opmaak in de pagina's zelf verwerkt.

Pagina 1:


Pagina 2:


styles.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<style>
#header {
    background-color:#373332;
    color:white;
    width:100%;
    height:7%;
    padding:0%;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    font-family:Arial, Helvetica, sans-serif;
    font-size:115%;
}
#section {
    background-color:#f5f5f5;
    color:#b51c54;
    width:90%;
    height:50%;
    padding:5%;
    margin-left:auto;
    margin-right:auto;
    font-family:Arial, Helvetica, sans-serif;
    font-size:115%;
}
#section2 {
    background-color:#f5f5f5;
    color:#373332;
    width:90%;
    height:50%;
    padding:5%;
    margin-left:auto;
    margin-right:auto;
    font-family:Arial, Helvetica, sans-serif;
    font-size:115%;
}
table {
    border-width:1%;
    color:#373332;
    font-family:Arial, Helvetica, sans-serif;
    font-size:115%;
}
input {
    color:#b51c54;
    font-family:Arial, Helvetica, sans-serif;
    font-size:115%;
}
#rozekop {
    color:#b51c54;
}
#footer {
    background-color:#f5f5f5;
    color:white;
    width:92%;
    height:6%;
    padding:4%;
    margin-left:auto;
    margin-right:auto;
    font-family:Arial, Helvetica, sans-serif;
    font-size:115%;
}
button {
    background-color:#b51c54;
    width:30%;
    padding:1%;
    border-width:0px;
    color:white;
    font-weight:bold;
    font-family:Arial, Helvetica, sans-serif;
    font-size:115%;
}
</style>
  maandag 30 november 2015 @ 19:48:39 #145
134533 donroyco
dus niet Donroyco
pi_157928250
quote:
0s.gif Op maandag 30 november 2015 19:44 schreef GuitarJJ het volgende:
Iemand enig idee waarom pagina 1 wel speciale tekens (zoals é en ¤) weergeeft, maar pagina 2 totaal niet? Ze zijn beiden aan hetzelfde css-bestand verbonden en verder zit er eigenlijk geen opmaak in de pagina's zelf verwerkt.

Pagina 1:
[ afbeelding ]

Pagina 2:
[ afbeelding ]

styles.css
[ code verwijderd ]

Pagina's niet opgeslagen als UTF-8?
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_157928512
quote:
7s.gif Op maandag 30 november 2015 19:48 schreef donroyco het volgende:

[..]

Pagina's niet opgeslagen als UTF-8?
Het lijkt geen verschil te maken als ik <meta charset="UTF-8"> tussen head zet.

edit: Als ik de pagina opsla als .html-pagina (in plaats van .php) werken de tekens wel.

[ Bericht 8% gewijzigd door GuitarJJ op 30-11-2015 20:10:55 ]
  maandag 30 november 2015 @ 20:13:57 #147
230788 n8n
Pragmatisch
pi_157928918
quote:
0s.gif Op maandag 30 november 2015 19:56 schreef GuitarJJ het volgende:

[..]

Het lijkt geen verschil te maken als ik <meta charset="UTF-8"> tussen head zet.

edit: Als ik de pagina opsla als .html-pagina (in plaats van .php) werken de tekens wel.
De karakters hebben ook een encoding, die moet wel overeenkomen met de encoding van de pagina.
Specialization is for insects”.—Robert Heinlein
pi_157929272
quote:
1s.gif Op maandag 30 november 2015 20:13 schreef n8n het volgende:

[..]

De karakters hebben ook een encoding, die moet wel overeenkomen met de encoding van de pagina.
Stond blijkbaar op ANSI. Als ik het bestandje zelf opsla als UTF-8, krijg ik helaas de volgende melding:

Warning: session_start(): Cannot send session cache limiter - headers already sent (output started at /home/voordegi/public_html/veapp/uitkomst.php:1) in /home/voordegi/public_html/veapp/uitkomst.php on line 2

1
2
3
4
5
6
<?
session_start();
$cataloguswaarde = $_SESSION["cataloguswaarde"];
$aankoopwaarde = $_SESSION["aankoopwaarde"];
$ouderdom = $_SESSION["ouderdom"];
...
  maandag 30 november 2015 @ 22:11:45 #149
230788 n8n
Pragmatisch
pi_157933053
quote:
0s.gif Op maandag 30 november 2015 20:29 schreef GuitarJJ het volgende:

[..]

Stond blijkbaar op ANSI. Als ik het bestandje zelf opsla als UTF-8, krijg ik helaas de volgende melding:

Warning: session_start(): Cannot send session cache limiter - headers already sent (output started at /home/voordegi/public_html/veapp/uitkomst.php:1) in /home/voordegi/public_html/veapp/uitkomst.php on line 2
[ code verwijderd ]

daar is het php voor dummies voor, zou het zo niet weten.
Specialization is for insects”.—Robert Heinlein
pi_157934159
quote:
0s.gif Op maandag 30 november 2015 20:29 schreef GuitarJJ het volgende:

[..]

Stond blijkbaar op ANSI. Als ik het bestandje zelf opsla als UTF-8, krijg ik helaas de volgende melding:

Warning: session_start(): Cannot send session cache limiter - headers already sent (output started at /home/voordegi/public_html/veapp/uitkomst.php:1) in /home/voordegi/public_html/veapp/uitkomst.php on line 2
[ code verwijderd ]

Waarschijnlijk voegt je editor een Byte Order Mark (BOM) toe. Da's een onzichtbaar teken maar wel een die voor de php open tag staat en die dus meteen uitvoer start.
  dinsdag 1 december 2015 @ 20:40:05 #151
37634 wobbel
Da WoBBeL King
pi_157953611
Weet iemand hoe het volgende heet, als ik dat weet kan ik vast wel wat kant en klare oplossingen vinden die ik kan aanpassen :)

Ik wil vanuit een linker dropdown een item selecteren en dat deze in een lijst komt te staan met geselecteerde items.

Stel, ik selecteer "Banaan" dan komt er ergens op de pagina te staan dat ik "Banaan met value 2" heb geselecteerd. Als ik vervolgens uit die dropdown "Peer" selecteer komt deze er ook bij en wordt de lijst "Banaan met value 2; Peer met value 15" net zo veel als ik items in de dropdown selecteer.

Een simpele "append" aan een div gaat hem neit worden, ik moet de items ook kunnen wissen als ik wil en daarna wordt er een POST gedaan met alle values erin naar een andere pagina.

[ Bericht 4% gewijzigd door wobbel op 01-12-2015 20:48:08 ]
  dinsdag 1 december 2015 @ 21:53:51 #152
118011 BrainOverfloW
Fok! around the Clock!
pi_157955749
quote:
0s.gif Op dinsdag 1 december 2015 20:40 schreef wobbel het volgende:
Weet iemand hoe het volgende heet, als ik dat weet kan ik vast wel wat kant en klare oplossingen vinden die ik kan aanpassen :)

Ik wil vanuit een linker dropdown een item selecteren en dat deze in een lijst komt te staan met geselecteerde items.

Stel, ik selecteer "Banaan" dan komt er ergens op de pagina te staan dat ik "Banaan met value 2" heb geselecteerd. Als ik vervolgens uit die dropdown "Peer" selecteer komt deze er ook bij en wordt de lijst "Banaan met value 2; Peer met value 15" net zo veel als ik items in de dropdown selecteer.

Een simpele "append" aan een div gaat hem neit worden, ik moet de items ook kunnen wissen als ik wil en daarna wordt er een POST gedaan met alle values erin naar een andere pagina.
Is multiselect.js iets voor je?
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_157955904
Ik weet niet of dat nou een specifieke naam heeft? Maar wat je wil is eenvoudig, vooral als je een 'multiple select' element gebruikt, want die zijn gemaakt om meerdere elementen tegelijk te kunnen selecteren (een normale dropdown niet). Het is een kwestie van de waarde van dat element uitlezen, dat is ook heel makkelijk te POSTen omdat het een form element is.

Als je een data binding library gebruikt is het helemaal een eitje, want dan blijft je UI automatisch in sync met het select element en hoef je niet zelf de data uit het element te peuteren. En je data blijft gewoon een standaard JS object, ook dat kun je eenvoudig POSTen.

http://jsfiddle.net/yfw3159k/5/

Maar het handmatig doen is ook niet zo heel ingewikkeld:

http://jsfiddle.net/7jnouaj5/
"You wanna be bald? Do what I did: wait a while. In the meantime, there is no excuse for running around looking like a freshly circumcised dick."
  woensdag 2 december 2015 @ 07:54:28 #154
37634 wobbel
Da WoBBeL King
pi_157960968
Ik durf het niet te zeggen, maar mijn beunhaas code heb ik zelf voor elkaar gekregen. Om 21:00 had ik nog geen reactie dus toen dacht ik: ik kan zelf ook wel wat proberen :+

Resultaat is om te janken, maar het werkt!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
 <script>
jQuery(document).ready(function(){
    
    $( "#product" ).on('keyup', function(e){
        //Improved with keycode checking to prevent extra typing after select
        var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
        var keyCode = $.ui.keyCode;
        if(key != keyCode.ENTER && key != keyCode.LEFT && key != keyCode.RIGHT && key != keyCode.DOWN) {
            $('#productid').val("");
        }
    });    
    $( "#product" ).combogrid({
    url: '/ajax_producten.php?all=false',
    colModel: [{'columnName':'name','width':'90','label':'Selecteer product'}],
    select: function( event, ui ) {
        $( "#product" ).val( "" );
        $( "#hardwaremelding" ).empty();
        $("#hardwarecontainer").append('<div class="hardware" data-hwid="' + ui.item.id + '">' + ui.item.name + '<a href="#"><img src="/static/img/delete_18x18.png" width="18" height="18" /></a></div>');
        return false;
    }
    });
    
    
    $('#hardwarecontainer').on('click', 'a', function () {        
        
        $( this ).closest("div").remove();
        
        if ($('#hardwarecontainer').is(':empty')){
         
             $('#hardwaremelding').html("<em>Geen hardware geselecteerd.</em>");
          
        }        
    });
    
    $( "#hardwareform" ).submit(function( event ) {
        
        if ($('#hardwarecontainer').is(':empty'))
        {
            
            alert ( "Zucht...geen hardware geselecteerd :-)" );
            event.preventDefault();
        
        }
        else
        {
            
            var dataList = $(".hardware").map(function() {
                return $(this).data("hwid");
            }).get();
            
            $("#hardware").val(dataList.join("|") );
            
        }
        
    });
    
});
</script>
pi_157966282
Iemand hier ervaring met een Wordpress die alleen JSON uitspuugt (bijv via de wp-api plugin) en daar dan een angular applicatie omheen bouwen? Leek me wel een leuke uitdaging + wat betere scheiding tussen front- end backend (geen php-html-spaghetti themes meer). Haal ik me hier allerlei onverwachte troep mee op de hals?
  woensdag 2 december 2015 @ 15:57:19 #156
56176 Catch22-
Ben je Blind?!
pi_157966294
quote:
14s.gif Op woensdag 2 december 2015 15:56 schreef picodealion het volgende:
Iemand hier ervaring met een Wordpress die alleen JSON uitspuugt (bijv via de wp-api plugin) en daar dan een angular applicatie omheen bouwen? Leek me wel een leuke uitdaging + wat betere scheiding tussen front- end backend (geen php-html-spaghetti themes meer). Haal ik me hier allerlei onverwachte troep mee op de hals?
Ik heb wel gezien dat ionic met WP samenwerkt, zal dus hetzelfde principe gebruiken.

http://code.tutsplus.com/(...)angularjs--cms-24170
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_157966323
Ah, dat is precies de WP plugin die ik ook wilde gebruiken. Wellicht niet een heel verkeerd idee dus.
  donderdag 3 december 2015 @ 13:01:56 #158
230788 n8n
Pragmatisch
pi_157985353
Zijn er hier gebruikers van kirbycms? Kan het zeer aanraden, het kost wel geld, 29/99 euro afhankelijk van commercieel gebruik maar is echt chill om mee te werken, je kan het wel gratis downloaden om te proberen. Ook klanten vinden het erg overzichtelijk.

De API lijkt op jQuery dus het is een kwestie van methods linken. De docs zijn ook erg duidelijk.

Klinkt erg spam allemaal, maar ik ben er gewoon erg over te spreken.
Specialization is for insects”.—Robert Heinlein
  donderdag 3 december 2015 @ 13:49:51 #159
56176 Catch22-
Ben je Blind?!
pi_157986242
quote:
14s.gif Op woensdag 2 december 2015 15:58 schreef picodealion het volgende:
Ah, dat is precies de WP plugin die ik ook wilde gebruiken. Wellicht niet een heel verkeerd idee dus.
Gewoon testen, pruts & learn
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_157986656
Jup, eerste POCje al gemaakt gisteren en werkt prima. Lijkt erop dat we hiermee doorgaan.
pi_157986670
quote:
17s.gif Op donderdag 3 december 2015 13:01 schreef n8n het volgende:
Zijn er hier gebruikers van kirbycms? Kan het zeer aanraden, het kost wel geld, 29/99 euro afhankelijk van commercieel gebruik maar is echt chill om mee te werken, je kan het wel gratis downloaden om te proberen. Ook klanten vinden het erg overzichtelijk.

De API lijkt op jQuery dus het is een kwestie van methods linken. De docs zijn ook erg duidelijk.

Klinkt erg spam allemaal, maar ik ben er gewoon erg over te spreken.
Welk probleem lost het voor me op?
  donderdag 3 december 2015 @ 14:38:23 #162
230788 n8n
Pragmatisch
pi_157987183
quote:
14s.gif Op donderdag 3 december 2015 14:13 schreef picodealion het volgende:

[..]

Welk probleem lost het voor me op?
Het is veel beter gestructureerd dan alle andere cms-en die ik heb geprobeerd, de output is volledig vrij, flat-file dus drop-installatie en backup, de API is uitgebreid maar makkelijk te doorgronden.

Alles is ook veel makkelijker dan bijvoorbeeld wordpress, zowel qua onderhoud van velden, templates, content managen, snelheid om iets op te zetten.

Als je het nu download heb je in een paar uur een werkende website, zonder er ooit mee gewerkt te hebben omdat het allemaal erg logisch in elkaar steekt.

Je bent wel meer op jezelf aangewezen, er zijn bijvoorbeeld minder plug-ins en kant en klare templates. Aan de andere kant zijn functies ook makkelijk toe te voegen, en templates maak ik persoonlijk altijd zelf. (Json bijvoorbeeld is net zo makkelijk te pushen als html, je kan in 1 template html of json uitspugen afhankelijk van of het via xhr wordt aangeroepen).

Staat ook in html/css/js omdat je daar nu meer tijd voor over hebt, zeker omdat de API op jQuery lijkt - wat alom gebruikt wordt voor de abstractie en method chaining.
Specialization is for insects”.—Robert Heinlein
  vrijdag 4 december 2015 @ 15:07:39 #163
118011 BrainOverfloW
Fok! around the Clock!
pi_158010684
Flexbox Froggy
Voor wie nog niet zo bekend is met flexbox, een klein spelletje om de verschillende properties te leren kennen.
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_158014198
quote:
14s.gif Op woensdag 2 december 2015 15:56 schreef picodealion het volgende:
Iemand hier ervaring met een Wordpress die alleen JSON uitspuugt (bijv via de wp-api plugin) en daar dan een angular applicatie omheen bouwen? Leek me wel een leuke uitdaging + wat betere scheiding tussen front- end backend (geen php-html-spaghetti themes meer). Haal ik me hier allerlei onverwachte troep mee op de hals?
Waarom zou je zoiets met wordpress (of uberhaupt in een full blown CMS) willen doen?
  zaterdag 5 december 2015 @ 10:36:44 #165
137776 boem-dikkie
Jedi Mind Baby!
pi_158029042
quote:
14s.gif Op vrijdag 4 december 2015 18:12 schreef KomtTijd... het volgende:

[..]

Waarom zou je zoiets met wordpress (of uberhaupt in een full blown CMS) willen doen?
Omdat WP uitermate geschikt is voor het beheren van content?
Ik weet niks van Hindoes. Wel van Samoerai en andere dingen.
  zaterdag 5 december 2015 @ 10:39:23 #166
137776 boem-dikkie
Jedi Mind Baby!
pi_158029076
quote:
14s.gif Op woensdag 2 december 2015 15:56 schreef picodealion het volgende:
Iemand hier ervaring met een Wordpress die alleen JSON uitspuugt (bijv via de wp-api plugin) en daar dan een angular applicatie omheen bouwen? Leek me wel een leuke uitdaging + wat betere scheiding tussen front- end backend (geen php-html-spaghetti themes meer). Haal ik me hier allerlei onverwachte troep mee op de hals?
Je kunt zelf gewoon API endpoints maken in WordPress die JSON uitspugen, vrij simpel. Daarnaast kun je met de nieuwe WP core (Calypso) binnenkort een hoop meer doen in de richting waar jij naar toe wil. Zie bijvoorbeeld de API documentatie: https://developer.wordpress.com/docs/api/
Ik weet niks van Hindoes. Wel van Samoerai en andere dingen.
pi_158030808
quote:
14s.gif Op vrijdag 4 december 2015 18:12 schreef KomtTijd... het volgende:

[..]

Waarom zou je zoiets met wordpress (of uberhaupt in een full blown CMS) willen doen?
Omdat de content moet worden kunnen toegevoegd door een klein handje personeel dat niet heel technisch onderlegd is. Wordpress werken we al jaren mee en zijn ze bekend mee. Hoe minder tijd we hoeven te besteden aan de backend (bouwen en training) hoe meer vrijheid we hebben voor een toffe front-end. Het gaat om een bedrijfssite, dus het budget is zoals gewoonlijk niet heel ruim en we willen vooral laten zien dat we goed zijn in front-end.

We willen een aantal dingen die al standaard ingebouwd zitten of gemakkelijk zijn (blog, paar verschillende post types voor dingen als voorbeeldcases en proposities), comments, tags, etc. Plus integratie met een aantal zustersites die ook in Wordpress zijn.
pi_158030819
quote:
7s.gif Op zaterdag 5 december 2015 10:39 schreef boem-dikkie het volgende:

[..]

Je kunt zelf gewoon API endpoints maken in WordPress die JSON uitspugen, vrij simpel. Daarnaast kun je met de nieuwe WP core (Calypso) binnenkort een hoop meer doen in de richting waar jij naar toe wil. Zie bijvoorbeeld de API documentatie: https://developer.wordpress.com/docs/api/
Ga ik checken, dank.
pi_158055760
quote:
7s.gif Op zaterdag 5 december 2015 10:36 schreef boem-dikkie het volgende:

[..]

Omdat WP uitermate geschikt is voor het beheren van content?
Die schiet je toch ook gewoon via je API in?
quote:
14s.gif Op zaterdag 5 december 2015 13:02 schreef picodealion het volgende:

[..]

Omdat de content moet worden kunnen toegevoegd door een klein handje personeel dat niet heel technisch onderlegd is. Wordpress werken we al jaren mee en zijn ze bekend mee. Hoe minder tijd we hoeven te besteden aan de backend (bouwen en training) hoe meer vrijheid we hebben voor een toffe front-end. Het gaat om een bedrijfssite, dus het budget is zoals gewoonlijk niet heel ruim en we willen vooral laten zien dat we goed zijn in front-end.

We willen een aantal dingen die al standaard ingebouwd zitten of gemakkelijk zijn (blog, paar verschillende post types voor dingen als voorbeeldcases en proposities), comments, tags, etc. Plus integratie met een aantal zustersites die ook in Wordpress zijn.
Mja volgens mij heb je op zich niets aan een CMS voor een volledig api-driven webapp, maar als je er mee bekend bent is het al snel een stuk makkelijker dan opnieuw het wiel uitvinden of bekend raken met een (ander) framework idd.
pi_158056755
Plus, als we ooit eens van WP af willen hoeven we niet ook nog eens de front-end opnieuw te schrijven, zolang wat we dan ook als nieuwe backend nemen maar dezelfde JSON uitspuugt (of in elk geval vergelijkbaar, zodat we alleen de angular service(s) aan hoeven te passen)
  zondag 6 december 2015 @ 14:59:59 #171
84244 Scorpie
Abject en infaam!
pi_158056793
quote:
7s.gif Op zaterdag 5 december 2015 10:36 schreef boem-dikkie het volgende:

[..]

Omdat WP uitermate geschikt is voor het beheren van content?
Maar WP heeft als nadeel dat er ook opmaak in die content verweven zit.
Op dinsdag 13 augustus schreef Xa1pt:
Neuh, fraude mag best aangepakt worden. Maar dat het de maatschappij meer oplevert of beter is voor de samenleving, is nog maar de vraag.
Op donderdag 25 juni 2015 schreef KoosVogels:
Klopt. Ik ben een racist.
pi_158130274
quote:
14s.gif Op zondag 6 december 2015 14:58 schreef picodealion het volgende:
Plus, als we ooit eens van WP af willen hoeven we niet ook nog eens de front-end opnieuw te schrijven, zolang wat we dan ook als nieuwe backend nemen maar dezelfde JSON uitspuugt (of in elk geval vergelijkbaar, zodat we alleen de angular service(s) aan hoeven te passen)
Waarschijnlijk wist je het zelf vorige week al, maar: http://tweakers.net/nieuw(...)rest-integratie.html
  zaterdag 12 december 2015 @ 12:52:44 #173
230788 n8n
Pragmatisch
pi_158191695
Hoe lang ben je bezig Angular een beetje onder de knie te krijgen? Vind het voor m'n eigen werk overbodig maar nu oriënterend op een baan wordt het echt _overal_ gevraagd.
Specialization is for insects”.—Robert Heinlein
pi_158320395
Ik vraag me af of er een ongeschreven regel is mbt het openen van links in een nieuw tabblad.
Wat ik altijd doe is dat interne links in hetzelfde tabblad openen en externe links in een nieuwe. Alleen op mobiele apparaten is het niet fijn om tig tabbladen open te hebben, is mijn mening.
Welke keuzes maken jullie hierin eigenlijk als je interne/externe links gaat instellen?
  vrijdag 18 december 2015 @ 07:39:56 #175
56176 Catch22-
Ben je Blind?!
pi_158323152
quote:
9s.gif Op zaterdag 12 december 2015 12:52 schreef n8n het volgende:
Hoe lang ben je bezig Angular een beetje onder de knie te krijgen? Vind het voor m'n eigen werk overbodig maar nu oriënterend op een baan wordt het echt _overal_ gevraagd.
Ligt aan je niveau. In twee dagen kan je een eind komen qua basics.

Ik wil niet meer zonder. In een nieuw project met een nieuw framework (backenders gebruiken nu play framework) had ik nog geen angular. Toen ik een tabel zat op te bouwen in jquery was ik er al klaar mee. Gelijk angular er in gezet.

Als je vragen hebt, holler. Zou wel met 2 beginnen trouwens, beta is net uit. Op de site staat een goede tutorial, daarmee leer je de eerste dingen.
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_158347806
quote:
5s.gif Op donderdag 17 december 2015 23:37 schreef karton2 het volgende:
Ik vraag me af of er een ongeschreven regel is mbt het openen van links in een nieuw tabblad.
Wat ik altijd doe is dat interne links in hetzelfde tabblad openen en externe links in een nieuwe. Alleen op mobiele apparaten is het niet fijn om tig tabbladen open te hebben, is mijn mening.
Welke keuzes maken jullie hierin eigenlijk als je interne/externe links gaat instellen?
De officiële regel is heel duidelijk: nooit een target gebruiken, de gebruiker kiest zelf wel of hij middenklikt of linksklikt. Maar vrij gebruikelijk is idd om externe links toch in een nieuwe tab te laten openen, omdat in de praktijk de meeste gebruikers dit toch eigenlijk verwachten. Je zult zelf moeten bepalen wat in jouw situatie het meest wenselijk is.

Wat betreft angular: heb er nooit echt mee gewerkt maar wel een beetje aan geroken, en naar mijn idee zit het goed in elkaar en moet het erg intuïtief zijn als je al een beetje gewend bent met frameworks en/of template engines te werken.
pi_158352193
quote:
9s.gif Op zaterdag 12 december 2015 12:52 schreef n8n het volgende:
Hoe lang ben je bezig Angular een beetje onder de knie te krijgen? Vind het voor m'n eigen werk overbodig maar nu oriënterend op een baan wordt het echt _overal_ gevraagd.
Ik denk dat je wel een paar weken verder bent voor je het echt onder de knie hebt. Als je gewend bent om gewoon old school DOM elementen te manipuleren dan moet je jezelf eigenlijk een andere manier van denken aanleren. Dit plaatje somt het wel mooi op :P

"You wanna be bald? Do what I did: wait a while. In the meantime, there is no excuse for running around looking like a freshly circumcised dick."
  zaterdag 19 december 2015 @ 20:17:39 #178
230788 n8n
Pragmatisch
pi_158362913
Bedankt voor de antwoorden, ik haal er uit dat het easy to learn, hard to master is wat enigszins logisch is. Ik heb overigens nog nooit gevoelens van blijdschap gehad met frontend frameworks dus ik ben benieuwd. Nu alleen nog een REST applicatie om mee te spelen, kan ik het beste een sandbox creëeren of is dat ook online te vinden (om mee te binden en spelen).

Ga wel meteen voor 2 dan ja, al lees ik overal dat je dan beter meteen over kan gaan op React, ik ga het proberen.
Specialization is for insects”.—Robert Heinlein
  zaterdag 19 december 2015 @ 20:22:02 #179
56176 Catch22-
Ben je Blind?!
pi_158363049
quote:
1s.gif Op zaterdag 19 december 2015 20:17 schreef n8n het volgende:
Bedankt voor de antwoorden, ik haal er uit dat het easy to learn, hard to master is wat enigszins logisch is. Ik heb overigens nog nooit gevoelens van blijdschap gehad met frontend frameworks dus ik ben benieuwd. Nu alleen nog een REST applicatie om mee te spelen, kan ik het beste een sandbox creëeren of is dat ook online te vinden (om mee te binden en spelen).

Ga wel meteen voor 2 dan ja, al lees ik overal dat je dan beter meteen over kan gaan op React, ik ga het proberen.
Ik kan soms intens genieten van angular hoor. Ben nu met een prototype bezig en dat wordt echt kickass door angular.

Anders zet je even een wordpress site op met die nieuwe rest API.
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?
  zaterdag 19 december 2015 @ 21:26:12 #180
230788 n8n
Pragmatisch
pi_158364865
Ik ben nu bezig met kirbycms alle content op een pagina te laten indexeren en afhankelijk van of een request via Ajax gaat het als json te sturen en anders als html.

Ik ben begonnen met een php functie el() waarmee je met een array stukken html kan uitpoepen. Deze functie ga ik dan ook in JS maken zodat je in php en JS praktisch dezelfde templates kan schrijven, en deze automatisch renderen afhankelijk van het request.

Als dit af is heb ik in principe een REST API (al dan niet alleen GET) waarmee ik dan ff ga klooien.

(Voordeel voor mij is dat zonder JS de pagina nog werkt en dat de html ‘minified' gestuurd wordt, dat en de templates zijn vrijwel identiek).
Specialization is for insects”.—Robert Heinlein
  maandag 4 januari 2016 @ 11:47:07 #181
230788 n8n
Pragmatisch
pi_158813471
Is er qua performance een (duidelijk) verschil of je in 1 click event checkt wat er geklikt is en dan reageert, of per element een apart click event te attachen?

http://stackoverflow.com/a/8496919 Hier heb ik het over
Specialization is for insects”.—Robert Heinlein
pi_158813555
quote:
14s.gif Op zaterdag 19 december 2015 21:26 schreef n8n het volgende:
Ik ben nu bezig met kirbycms alle content op een pagina te laten indexeren en afhankelijk van of een request via Ajax gaat het als json te sturen en anders als html.

Ik ben begonnen met een php functie el() waarmee je met een array stukken html kan uitpoepen. Deze functie ga ik dan ook in JS maken zodat je in php en JS praktisch dezelfde templates kan schrijven, en deze automatisch renderen afhankelijk van het request.

Als dit af is heb ik in principe een REST API (al dan niet alleen GET) waarmee ik dan ff ga klooien.

(Voordeel voor mij is dat zonder JS de pagina nog werkt en dat de html ‘minified' gestuurd wordt, dat en de templates zijn vrijwel identiek).
Je bent CakePHP aan het nabouwen?
Drop drop drop drop drop drop drop!!!! DROP!!! drop drop drop drop !!
  maandag 4 januari 2016 @ 12:29:10 #183
230788 n8n
Pragmatisch
pi_158814420
quote:
0s.gif Op maandag 4 januari 2016 11:51 schreef JeSuisDroppie het volgende:

[..]

Je bent CakePHP aan het nabouwen?
Mogelijk?

Edit: nope, alleen een klein deel van de view class.
Specialization is for insects”.—Robert Heinlein
pi_158834467
Jammer dat Sass geen currentColor ondersteunt
  maandag 4 januari 2016 @ 23:20:28 #185
230788 n8n
Pragmatisch
pi_158834577
quote:
9s.gif Op maandag 4 januari 2016 23:17 schreef TwyLight het volgende:
Jammer dat Sass geen currentColor ondersteunt
voor wat?
Specialization is for insects”.—Robert Heinlein
pi_158834661
quote:
1s.gif Op maandag 4 januari 2016 23:20 schreef n8n het volgende:

[..]

voor wat?
darken(currentColor, 10);

ofzo :P
  dinsdag 5 januari 2016 @ 10:23:27 #187
134533 donroyco
dus niet Donroyco
pi_158841308
quote:
0s.gif Op dinsdag 5 januari 2016 10:18 schreef Jimbo het volgende:
Regelmatig zie je op hardware.info, tweakers en andere websites (fok?) een achtergrond van de website die volledig klikbaar is gemaakt.

Na wat rond te kloten kom ik eigenlijk geen stap verder.. Heeft iemand een idee hoe je dit gemakkelijk kan doen op een website? Zit dit in de CSS of ? (of werk je misschien met een image map die je klikbaar maakt?

Ik hoort t graag!
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_158842033
quote:
0s.gif Op dinsdag 5 januari 2016 10:18 schreef Jimbo het volgende:
Regelmatig zie je op hardware.info, tweakers en andere websites (fok?) een achtergrond van de website die volledig klikbaar is gemaakt.

Na wat rond te kloten kom ik eigenlijk geen stap verder.. Heeft iemand een idee hoe je dit gemakkelijk kan doen op een website? Zit dit in de CSS of ? (of werk je misschien met een image map die je klikbaar maakt?

Ik hoort t graag!
Een onclick handler op bijvoorbeeld de body zetten?
Of bedoel je iets anders?
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
  Moderator dinsdag 5 januari 2016 @ 12:15:08 #189
1424 crew  Jimbo
Gråtrunka
pi_158843587
quote:
7s.gif Op dinsdag 5 januari 2016 11:01 schreef Aether het volgende:

[..]

Een onclick handler op bijvoorbeeld de body zetten?
Of bedoel je iets anders?
Hoe ik het nu heb is twee grote CSS blokken aan de zijkant van de website die ik klikbaar wil maken.

Indien ik position:aboslute; gebruik staan ze goed, maar zijn ze niet klikbaar (heb de z-index al tot 999999999 aangepast, en nog niks :( )

indien ik een andere position gebruik dan blijven ze niet goed op de plek staan, hoe kleiner of hoe groter ik het scherm maak, hoe meer ze heen en weer dansen :(

Je moet het een beetje zo zien: (ik neem fok als voorbeeld:) we hebben hier het fok forum van (uit mn hoofd) 1000px breed. De grijze achtergrond die we hier hebben is bij mij een plaatje, en die wil ik graag laten linken naar een andere pagina.

Hoop dat je het zo begrijpt :X
Op donderdag 20 augustus 2020 17:36 schreef Notorious_Roy het volgende:
Naast alle onzin die je uitkraamt heb je af en toe ook gewoon heel verstandige posts.
Op dinsdag 10 augustus 2021 16:32 schreef yvonne het volgende:
@:Jimbo voor mod, yeah *O*
pi_158843764
We begrijpen wat je wilt, we begrijpen alleen niet waarom dat niet zou lukken. Post eens een testcase of zo.
  dinsdag 5 januari 2016 @ 12:26:31 #191
230788 n8n
Pragmatisch
pi_158843830
Je moet position fixed doen en dan top:0; right:0; bottom:0; left:0;

En z-index werkt alleen relatief tot de eerste parent die niet position: static; heeft.
Specialization is for insects”.—Robert Heinlein
  Moderator dinsdag 5 januari 2016 @ 12:28:46 #192
1424 crew  Jimbo
Gråtrunka
pi_158843879
quote:
1s.gif Op dinsdag 5 januari 2016 12:26 schreef n8n het volgende:
Je moet position fixed doen en dan top:0; right:0; bottom:0; left:0;

En z-index werkt alleen relatief tot de eerste parent die niet position: static; heeft.
als ik dit doe is de hele website klikbaar, dus ook het gedeelte waar normaal de tekst en de linkjes staan :P
Op donderdag 20 augustus 2020 17:36 schreef Notorious_Roy het volgende:
Naast alle onzin die je uitkraamt heb je af en toe ook gewoon heel verstandige posts.
Op dinsdag 10 augustus 2021 16:32 schreef yvonne het volgende:
@:Jimbo voor mod, yeah *O*
  dinsdag 5 januari 2016 @ 12:28:57 #193
230788 n8n
Pragmatisch
pi_158843880
quote:
0s.gif Op maandag 4 januari 2016 23:22 schreef TwyLight het volgende:

[..]

darken(currentColor, 10);

ofzo :P
ah zo, ik zet liever een handmatige waarde met een suffix op de variable name als modifier.

Dus $canvas, en $canvas-dim (of -vivid).
Specialization is for insects”.—Robert Heinlein
  dinsdag 5 januari 2016 @ 12:32:41 #194
230788 n8n
Pragmatisch
pi_158843945
quote:
0s.gif Op dinsdag 5 januari 2016 12:28 schreef Jimbo het volgende:

[..]

als ik dit doe is de hele website klikbaar, dus ook het gedeelte waar normaal de tekst en de linkjes staan :P
je moet zorgen dat je index tussen de pagina en je menu zit ja. Weet ff niet hoe ik dat eerder gedaan heb, zal zo ff kijken.

Tweakers’ implementatie is vrij brak, als je het menu wegslikt zijn de onderliggende elementen nog klikbaar. Klik verkeerd en je drukt op een link.
Specialization is for insects”.—Robert Heinlein
pi_158845173
quote:
1s.gif Op dinsdag 5 januari 2016 12:28 schreef n8n het volgende:

[..]

ah zo, ik zet liever een handmatige waarde met een suffix op de variable name als modifier.

Dus $canvas, en $canvas-dim (of -vivid).
Ik gebruik darken (of lighten etc) wel vaak voor hover effecten etc.

bv

.class {
background: $primary-color;

&:hover {
background: darken($primary-color, 10);
}
}
pi_158846877
quote:
0s.gif Op maandag 4 januari 2016 23:22 schreef TwyLight het volgende:

[..]

darken(currentColor, 10);

ofzo :P
Dat wordt wat lastig in sommige gevallen ;)
Bijvoorbeeld bij een LI element dat in UL en OL gebruikt kan worden.
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
  dinsdag 5 januari 2016 @ 14:52:14 #197
118585 Crutch
Filantroop || Taalzwengel
pi_158847246
quote:
7s.gif Op dinsdag 5 januari 2016 14:35 schreef Aether het volgende:

[..]

Dat wordt wat lastig in sommige gevallen ;)
Bijvoorbeeld bij een LI element dat in UL en OL gebruikt kan worden.
Daarom classes gebruiken he?
Je moeder is een hamster
  dinsdag 5 januari 2016 @ 21:24:24 #198
230788 n8n
Pragmatisch
pi_158858553
quote:
0s.gif Op dinsdag 5 januari 2016 13:23 schreef TwyLight het volgende:

[..]

Ik gebruik darken (of lighten etc) wel vaak voor hover effecten etc.

bv

.class {
background: $primary-color;

&:hover {
background: darken($primary-color, 10);
}
}
ik ook, maar liever zelf. Ben ik vergeten die z-index dingen op te zoeken. Morgen😬
Specialization is for insects”.—Robert Heinlein
  woensdag 6 januari 2016 @ 12:48:52 #199
230788 n8n
Pragmatisch
pi_158869906
Sorry Jimbo, ik had je verkeerd begrepen. Maar als je een afbeelding wilt linken, waarom niet in een anchor tag? ik dacht dat je dit bedoelde: http://d.pr/1lOhg (klik op hamburger of een avatar).

Heb iets met JS waar ik helemaal para van wordt :@

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
    // Event index
    var event = {         
        'scroll': scroll,
        'click': click,
    };
    
    // Add a listener to each event
    (function render(event){
        
        for (var action in event){
            if (typeof event[action] === 'function'){
                window.addEventListener(action, function(){
                    requestAnimationFrame(event[action])
                });        
            }
        }        

    })(event);

Een object met events, daar loop ik doorheen in render() en hang de referentie naar de functie in een loop aan een eventListener. Elke keer wanneer ik meer dan 1 event in het event object plaats, wordt altijd - zowel met scrollen als click - het eerste event afgevuurd. Kan iemand hier kaas van maken?


Heb er een JSbin van gemaakt: https://jsbin.com/vaxaxamefu/edit?js,console,output

maakt niet uit of je klikt of scrolled, het click event wordt elke keer aangeroepen.

[ Bericht 5% gewijzigd door n8n op 06-01-2016 12:59:30 ]
Specialization is for insects”.—Robert Heinlein
pi_158870992
quote:
7s.gif Op woensdag 6 januari 2016 12:48 schreef n8n het volgende:
Sorry Jimbo, ik had je verkeerd begrepen. Maar als je een afbeelding wilt linken, waarom niet in een anchor tag? ik dacht dat je dit bedoelde: http://d.pr/1lOhg (klik op hamburger of een avatar).

Heb iets met JS waar ik helemaal para van wordt :@
[ code verwijderd ]

Een object met events, daar loop ik doorheen in render() en hang de referentie naar de functie in een loop aan een eventListener. Elke keer wanneer ik meer dan 1 event in het event object plaats, wordt altijd - zowel met scrollen als click - het eerste event afgevuurd. Kan iemand hier kaas van maken?

Heb er een JSbin van gemaakt: https://jsbin.com/vaxaxamefu/edit?js,console,output

maakt niet uit of je klikt of scrolled, het click event wordt elke keer aangeroepen.
Gok: op het moment dat de event-handler wordt aangeroepen en requestAnimationFrame(event[action]) wordt aangeroepen is action gelijk aan de laatste waarde (=click) van de for.
Probeer de waarden uit event eens te wisselen en kijk of dan altijd de scroll-event wordt aangeroepen.
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
pi_158871265
Door gebruik te maken van een forEach loop krijg je dit soort closure/scope problemen niet. Of door de functie die de events bind buiten de for-loop te definieren zoals hieronder. Er zijn vast nog wel meer oplossingen :)

quote:
// Event index
var event = {
'scroll': scroll,
'click': click,
};

// Add a listener to each event
(function listen(event){

var bind = function(action){

if (typeof event[action] === 'function'){
window.addEventListener(action, function(){
requestAnimationFrame(event[action]);
});
}

};

for (var action in event){
bind(action);
}

})(event);

function scroll(event){
console.log('scroll', event);
}

function click(event){
console.log('click', event);
}
Bleuh.
  woensdag 6 januari 2016 @ 14:15:00 #202
230788 n8n
Pragmatisch
pi_158872151
Ah bedankt voor de antwoorden. Kan weer even verder.


quote:
0s.gif Op woensdag 6 januari 2016 13:44 schreef PimD het volgende:
Door gebruik te maken van een forEach loop krijg je dit soort closure/scope problemen niet. Of door de functie die de events bind buiten de for-loop te definieren zoals hieronder. Er zijn vast nog wel meer oplossingen :)

[..]

Awesome, dit werkte. https://jsbin.com/sifasugoda/1/edit?js,console,output *link gecorrigeerd

Ik heb nog 1 probleem, in het click(event){} krijg ik een getal, geen event(.target) object. Te zien in de console wanneer je klikt. (ook wanneer je scrolled, maar ik wil 1 eventListener per type en dan tijdens het event checken waarop is geklikt).

Sorry voor de onwetendheid, verdiep me voor het eerst in zulke paden :@

edit, gelukt:
1
2
3
window.addEventListener(events[key], function(event){
    requestAnimationFrame(function(){ actions[key](event); });
});

Zeer bedankt voor de hulp

[ Bericht 50% gewijzigd door n8n op 06-01-2016 15:30:37 ]
Specialization is for insects”.—Robert Heinlein
pi_158874272
Beste Fok!ers,

Ik ben sinds kort weer bezig mijn HTML/CSS skills te ontwikkelen, maar ik loop bij het coden van een design aan tegen het feit dat de padding-top eigenschap van mijn eerste DIV mijn volgende DIV beïnvloedt:

Hierbij heb ik de volgende code gebruikt:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 <body>
                        <div id="topmenubg">
                                 <div id="topmenu">
                                             <div class="topmenu_left">
                                                      <p><a href="#">Help</a>     <a href="#">Contact</a>    <a href="#">Responsible gaming</a>
                                                           <a href="#">Payment methods</a>
                                                      </p>
                                           </div>
                                            <div class="topmenu_right">
                                                         <p><a class="register" href="#">Register now</a> or Login</p>
                                                         <img src="images/form.png" alt="Form">
                                                         <img src="images/form.png" alt="Form">
                                                         <img src="images/okbutton.png" alt="OK">
                                            </div>
                                 </div>
                        </div>
                                                         <div id="header">
                                                                 <div id="logo">
                                                                 </div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 #topmenubg {
background:url(images/topmenu_bg.jpg) repeat-x 0 0;
}

#topmenu {
width:1000px;
margin:auto;
font-size:8pt;
padding-top:8px;
padding-left:10px;
height:30px;
color:#6b6560;
}

#header {
width:1000px;
height:74px;
margin:auto;
background-color:#aaaaaa;
}

#logo {
margin-top:-8px;
width:261px;
height:74px;
background:url(images/logo.png);
float:left;
}

De padding-top eigenschap heb ik voor de tekst in de topmenu gebruikt om die te verticaal te centreren, maar daardoor gaat mijn header ook 8px omlaag en staat hij niet recht onder de topmenu. Ik kom er niet uit, hoe kan ik ervoor zorgen dat mijn header recht onder de topmenu komt te staan?

Alvast bedankt, Mike
  woensdag 6 januari 2016 @ 15:41:18 #204
230788 n8n
Pragmatisch
pi_158874442
Probeer #header display: block te geven. Je kan die padding beter op de links doen, dan zijn ze beter klikbaar.
Specialization is for insects”.—Robert Heinlein
pi_158874784
Dat die banner omlaag geduwd wordt komt omdat je #topmenu een height heeft die je combineert met een padding. Feitelijk je je menu aan de bovenkant nu meer dan 30 pixels alleen omdat je gebruik maakt van een background-image is dit niet direct zichtbaar.

Je kan beter de links in je menu zelf een top en bottom padding geven en de height van het menu weglaten.
pi_158874873
Over die background-image gesproken, aan je screenshot te zien kan ik geen reden bedenken waarom dit nodig is. een achtergrondkleur en border-bottom zal prima werken en maakt je website weer een stukje sneller
pi_158875532
Aah, dat was em!
Je hebt gelijk over de background-image, helemaal niet aan gedacht. 8)7

Hartelijk bedankt! :D

[ Bericht 12% gewijzigd door Maikkeyy op 06-01-2016 16:33:52 ]
pi_158875912
Een padding, borders etc komt altijd bovenop de breedte (of hoogte) die je zelf aangeeft. Als je een pagina 1000 pixels breed maakt met een padding van 10 pixels en een border van 1 pixel aan beide kanten is het resultaat 1022 pixels breed.1000 + 2x10 + 2x1.

height in css moet je eigenlijk zoveel mogelijk vermijden en de content zelf de hoogte laten bepalen.

In het geval van een navigatiebalk aan de bovenkant heb je in feite twee opties, de eerste is om de balk zelf een padding mee te geven en de tweede om de items die IN de balk komen te staan een padding te geven. In jouw geval is de tweede optie wenselijk omdat het geven van een padding aan de links in de balk dan over de gehele hoogte van de balk klikbaar zijn i.t.t. enkel de text wanneer je de balk zelf een padding geeft.
  woensdag 6 januari 2016 @ 22:56:46 #209
230788 n8n
Pragmatisch
pi_158888082
box-sizing: border-box;
Specialization is for insects”.—Robert Heinlein
pi_159324783
Haii,

Ben voor een familielid een website in elkaar aan 't knutselen. Template dit dat, dat lukt me allemaal nog wel. Maar nu wil ik op één pagina graag een grote 'tabel', waarin elke cel bestaat uit een (klein) plaatje met wat tekst eronder. Gewoon een tabel maken doe ik liever niet omdat het ook op kleine/mobiele schermen handig moet zijn.

Ik heb wat zitten stoeien en e.e.a. geprobeerd met <div> en <ul> bijv, en met wat css display properties (zowel display: inline-block als het hele display: flex gebeuren), maar het wil maar niet goed lukken.

Hebben jullie ideeën? Hier is een voorbeeld van wat ik tot nog toe heb: https://jsfiddle.net/wx578hgw/

Problemen tot nu toe:
1. de tekst staat niet onder het plaatje
2. Op mijn schermformaat lijkt het nu redelijk, maar als je het scherm verkleint verspringt bijvoorbeeld ineens de subtext naar de volgende rij terwijl het plaatje nog op de voorgaande rij staat. Ik wil graag dat het geheel echt als een tabel aandoet (anders lijkt het zo chaotisch). Niet alle plaatjes zullen exact hetzelfde formaat worden. Flex lijkt dit redelijk op te pakken maar voor de zekerheid: de hele rij heb ik het liefst dezelfde hoogte dus :)
  zaterdag 23 januari 2016 @ 11:20:13 #211
134533 donroyco
dus niet Donroyco
pi_159324916
quote:
0s.gif Op zaterdag 23 januari 2016 11:11 schreef gekkewiebel het volgende:
Haii,

Ben voor een familielid een website in elkaar aan 't knutselen. Template dit dat, dat lukt me allemaal nog wel. Maar nu wil ik op één pagina graag een grote 'tabel', waarin elke cel bestaat uit een (klein) plaatje met wat tekst eronder. Gewoon een tabel maken doe ik liever niet omdat het ook op kleine/mobiele schermen handig moet zijn.

Ik heb wat zitten stoeien en e.e.a. geprobeerd met <div> en <ul> bijv, en met wat css display properties (zowel display: inline-block als het hele display: flex gebeuren), maar het wil maar niet goed lukken.

Hebben jullie ideeën? Hier is een voorbeeld van wat ik tot nog toe heb: https://jsfiddle.net/wx578hgw/

Problemen tot nu toe:
1. de tekst staat niet onder het plaatje
2. Op mijn schermformaat lijkt het nu redelijk, maar als je het scherm verkleint verspringt bijvoorbeeld ineens de subtext naar de volgende rij terwijl het plaatje nog op de voorgaande rij staat. Ik wil graag dat het geheel echt als een tabel aandoet (anders lijkt het zo chaotisch). Niet alle plaatjes zullen exact hetzelfde formaat worden. Flex lijkt dit redelijk op te pakken maar voor de zekerheid: de hele rij heb ik het liefst dezelfde hoogte dus :)
1. Geef je list-items geen class '1' of '2', zie http://stackoverflow.com/(...)lass-names-selectors
2. Je structuur omgegooid, want het is niet nodig om een extra list-item aan te maken voor de tekst. https://jsfiddle.net/kqfskdfh/
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_159324942
quote:
7s.gif Op zaterdag 23 januari 2016 11:20 schreef donroyco het volgende:

[..]

1. Geef je list-items geen class '1' of '2', zie http://stackoverflow.com/(...)lass-names-selectors
2. Je structuur omgegooid, want het is niet nodig om een extra list-item aan te maken voor de tekst. https://jsfiddle.net/kqfskdfh/
Thanks, denk overigens dat ik het net nu heb opgelost met div'jes, na twee dagen lopen mopperen :')

Klopt dit ongeveer?
https://jsfiddle.net/wx578hgw/1/

Het domme alleen is dat bij een schermverkleining de boel toch wat gaat lopen verspringen. Mooist zou zijn dat een wat te breed plaatje bijv. twee kolommen aan breedte in zou nemen, waarna het volgende plaatje weer netjes begint op de plek van de derde kolom, nu rommelt het maar wat. Afijn misschien ben ik te pietluttig.
  zaterdag 23 januari 2016 @ 11:34:29 #213
134533 donroyco
dus niet Donroyco
pi_159325127
quote:
0s.gif Op zaterdag 23 januari 2016 11:21 schreef gekkewiebel het volgende:

[..]

Thanks, denk overigens dat ik het net nu heb opgelost met div'jes, na twee dagen lopen mopperen :')

Klopt dit ongeveer?
https://jsfiddle.net/wx578hgw/1/

Het domme alleen is dat bij een schermverkleining de boel toch wat gaat lopen verspringen. Mooist zou zijn dat een wat te breed plaatje bijv. twee kolommen aan breedte in zou nemen, waarna het volgende plaatje weer netjes begint op de plek van de derde kolom, nu rommelt het maar wat. Afijn misschien ben ik te pietluttig.
Zoveel divs heb je niet nodig.
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_159325162
ohh ik zie nu pas je link, je hebt t gefixt, thanks
of niet, huh, m'n hoofd is vol van al die < > 's :(
pi_159326780
quote:
0s.gif Op zaterdag 23 januari 2016 11:21 schreef gekkewiebel het volgende:

Het domme alleen is dat bij een schermverkleining de boel toch wat gaat lopen verspringen. Mooist zou zijn dat een wat te breed plaatje bijv. twee kolommen aan breedte in zou nemen, waarna het volgende plaatje weer netjes begint op de plek van de derde kolom, nu rommelt het maar wat. Afijn misschien ben ik te pietluttig.
Hier is een wat simpelere versie https://jsfiddle.net/9efv7v43/1/. Door een breedte in te stellen blijft het beter uitgelijnd staan.
pi_159356100
Beste FOK!kers,

Sinds mijn vraag een aantal posts terug heb ik mijn design weten af te maken, echter heb ik nog wel wat nieuwe vraagjes.

Dit is hem geworden: http://maikkeyy.site88.net/
Omdat ik eerst bijna alles als plaatje had(buttons etc.), dus zonder fysieke tekst, heb ik nu geprobeerd om zoveel mogelijk tekst te gebruiken i.p.v. een button plaatje waar al tekst in stond van Photoshop.

Vraag 1: Bij de rode SUBSCRIBE & PLAY NOW button, heb ik nu een div gebruikt, met als achtergrondafbeelding de rode button met play knopje, maar hoe kan ik ervoor zorgen dat de gehele grootte van de button aanklikbaar wordt als link? Dus niet alleen de tekst die er in staat?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 HTML:
<div id="playnowbutton">
<p><span style="color:#d7cac1;">SUBSCRIBE & </span><b>PLAY NOW</b></p>
</div>

CSS:

#playnowbutton {
margin-top:17px;
margin-left:15px;
float:left;
width:262px;
height:46px;
background:url(images/playnowbutton.png);
}

#playnowbutton p {
margin-top:13px;
margin-left:27px;

Vraag 2: De footer die ik onderaan de pagina heb, verscheen eigenlijk achter de verschillende gamevakjes, om dat te verhelpen heb ik clear:both aan de footer toegevoegd in css, en nu staat hij inderdaad mooi onder de vakjes. Maar margin-top werkt niet meer en ik kan de footer dus niet met wat afstand plaatsen van de vakjes. Hoe krijg ik dat voor elkaar?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
HTML:
<div id="footerbg">
<div id="footer">
<p><a href="#">Home</a>     <a href="#">Download Casino</a>     <a href="#">Casino Games</a>
                 <a href="#">Players Club</a>     <a href="#">Getting Started</a>     <a href="#">Promotions</a>     <a href="#">Contacts</a>
</p>
<span id="rights">CooperMedia 2016 All Rights Reserved</span>
<div id="follow">
<p>Follow the casino on:     <img src="images/Web.png" alt="Web"><img src="images/facebook.png" alt="Facebook"><img src="images/twitter.png" alt="Twitter">
</div>
</div>
</div>

CSS: #footerbg {
clear:both;
background-color:#000000;
border-top:1px solid #56514d;
height:120px;
margin-top:36px;
}

#footer {
font-size:12px;
width:940px;
margin:auto;
height:120px;
}

#footer p {
color:#fff;
padding-top:44px;
}

#footer a {
text-decoration:none;
color:#99918b;
}

#footer a:hover {
color:#aaaaaa;
}

#rights {
color:#484340;
}

#follow {
float:right;
margin-bottom:20px;
}

#follow p {
color:#99918b;
padding-top:0px;

Dan kom ik ook meteen bij mijn volgende vraag: het laatste "follow the casino on"-stukje in de footer komt onder de verschillende linkjes te staan, waarom staat hij gewoon niet rechts van de linkjes helemaal rechts uitgelijnd?

Verder merk ik dat ik echt bijna overal een div voor gebruik, is dat erg? c_/
En hoe gaan jullie om met het feit dat niet elke lettertype toegankelijk is voor iedereen, maar je die wel in je design hebt in Photoshop? Kiezen jullie dan toch voor een andere lettertype of?

Alvast Bedankt, Mike
  zondag 24 januari 2016 @ 18:04:29 #217
118011 BrainOverfloW
Fok! around the Clock!
pi_159361468
quote:
0s.gif Op zondag 24 januari 2016 14:27 schreef Maikkeyy het volgende:
Beste FOK!kers,

Sinds mijn vraag een aantal posts terug heb ik mijn design weten af te maken, echter heb ik nog wel wat nieuwe vraagjes.

Dit is hem geworden: http://maikkeyy.site88.net/

Omdat ik eerst bijna alles als plaatje had(buttons etc.), dus zonder fysieke tekst, heb ik nu geprobeerd om zoveel mogelijk tekst te gebruiken i.p.v. een button plaatje waar al tekst in stond van Photoshop.
Dat is zeker aan te raden. Alles wat je als code door kunt sturen ipv een plaatje moet je als code sturen. Simpelweg omdat een paar tekstregels sneller te versturen zijn dan een plaatje.
Dit geld dus niet alleen voor de tekst op een button, maar ook de button zelf. De achtergrond kleur, de ronde hoeken etc. Allemaal te doen in CSS in een fractie van de grootte van een plaatje.
Ook zijn ze sneller aanpasbaar en kun je makkelijker dingen als hover-state toevoegen.
Daarnaast maakt het de tekst ook leesbaar voor zoekmachines, schermlezers etc.

quote:
Vraag 1: Bij de rode SUBSCRIBE & PLAY NOW button, heb ik nu een div gebruikt, met als achtergrondafbeelding de rode button met play knopje, maar hoe kan ik ervoor zorgen dat de gehele grootte van de button aanklikbaar wordt als link? Dus niet alleen de tekst die er in staat?
[ code verwijderd ]

Dat kun je doen door je link te stijlen als een button, in plaats van de div er omheen. Ik heb een begin gemaakt in deze JSFiddle. Je kunt de stijl zelf nog wat verder aan kleden met de juiste font en een background gradient om hem precies de stijl te geven die je zoekt.

quote:
Vraag 2: De footer die ik onderaan de pagina heb, verscheen eigenlijk achter de verschillende gamevakjes, om dat te verhelpen heb ik clear:both aan de footer toegevoegd in css, en nu staat hij inderdaad mooi onder de vakjes. Maar margin-top werkt niet meer en ik kan de footer dus niet met wat afstand plaatsen van de vakjes. Hoe krijg ik dat voor elkaar?
[ code verwijderd ]

Dat komt omdat je al die blokken binnen #games een float-left gegeven hebt. Daardoor gaan ze 'zweven' en raakt de #games div zijn hoogte kwijt. Als je die div inspecteert (bijvoorbeeld met de DevTools in Chrome) zie je ook dat die een hoogte van 0px heeft.
Je footer heeft dus niks om die margin-top tegen af te zetten.

Om dat op te lossen moet je die floats verwijderen. Om vervolgens je blokken weer op een lijn te krijgen i.p.v. onder elkaar moet je ze de eigenschap "display: inline-block" mee geven. Hierdoor blijven ze zich als blok gedragen, en geven ze dus goed hun hoogte/breedte af, maar gedragen ze zich ook als tekst-elementen op een regel, waardoor ze netjes op een rij gaan staan.

Wat me op valt is dat je veel te veel gebruik maakt van ID's. Door elk item een ID te geven raak je de herbruikbaarheid van je code totaal kwijt aangezien je ID's maar op één item mag gebruiken.

Neem bijvoorbeeld je knoppen naar de verschillende speltypen. Die hebben allemaal een titel, plaatje en button onder elkaar. Die stijling kun je dus met een paar classes vormgeven en ze daarna vol elk speltype alleen de html van een blok kopiëren en de stijling gaat gelijk mee.

Dit punt kun je, samen met de inline-display oplossing terug zijn in deze JSFiddle

Daarnaast wegen ID's zwaarder dan classes bij de vraag welke stijl elementen weergegeven zullen worden. Dat kan soms voor onduidelijkheid zorgen over de vraag waarom een stijl element niet werkt terwijl je het wel toevoegt.

quote:
Dan kom ik ook meteen bij mijn volgende vraag: het laatste "follow the casino on"-stukje in de footer komt onder de verschillende linkjes te staan, waarom staat hij gewoon niet rechts van de linkjes helemaal rechts uitgelijnd?
Flauw gezegd, omdat dat precies is waar je hem neer zet. Kijk maar naar je code. Je plaats de div#follow onder je span#rights. Daarna gebruik je een float om hem naar rechts te schuiven. Dan komt die dus rechts onder je span#rights te staan.

Als je hem op gelijke hoogte met je links wilt hebben zul je hem daar ook moeten plaatsen. De volgorde wordt dan dus :
1
2
3
links
follow
copyright

Door de follow vervolgens naar rechts te floaten krijg je:

1
2
links                    follow
copyright


Het resultaat kun je zien in deze JSFiddle

Daarbij heb ik ook je link lijst vervangen door een unordered list met links. Hierdoor heb je meer controle over de stijling van de links en hoef je ze niet van elkaar af te zetten d.m.v. spaties
Op het moment dat je dat soort trucjes toe moet gaan passen om je design kloppend te krijgen zit er over het algemeen iets mis in je html of css opbouw.

quote:
Verder merk ik dat ik echt bijna overal een div voor gebruik, is dat erg? c_/
Erg is een groot woord, het is nog altijd kloppende html. Het is echter wel beter om de verschillende html tags te gebruiken waarvoor ze bedoeld zijn. Mede omdat je te maken hebt met meer dan alleen je gebruikers die je site via een browser bekijken. Beter gebruik van de juiste tags zorgt bijvoorbeeld voor betere leesbaarheid door systemen als Google. Wat je weer terug ziet in je Page ranking.

Bovendien is het voor jezelf ook sneller te typen en makkelijker terug te lezen.
1
2
3
4
<header>     <div class="header">
<nav>        <div class="navigation">
<button>     <div class="button">
<footer>     <div class="footer">

quote:
En hoe gaan jullie om met het feit dat niet elke lettertype toegankelijk is voor iedereen, maar je die wel in je design hebt in Photoshop? Kiezen jullie dan toch voor een andere lettertype of?

Alvast Bedankt, Mike
Lettertypes zijn via CSS mee te sturen naar de gebruiker. Lees je daarvoor eens in over font-face. Zorg wel voor een backup font mocht het inladen van de font-face niet werken. Dit kun je doen door meerdere fonts op te geven in het font-family attribuut.

Daar kun je voorlopig wel weer even ver mee denk ik :+
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_159366840
Bedankt voor je reactie!

Hier kan ik voorlopig zeker wel verder mee vooruit! :+
Ik denk dat ik de mogelijkheden van CSS heb onderschat, want na je vorige post ben ik het gaan aanpassen en hij ziet er hetzelfde uit met CSS zonder plaatje. ^O^
Ik dacht altijd maar dat al die effecten die ik in Photoshop maak niet mogelijk waren in CSS, maar dat is dus zeker niet zo.

Jouw 'display:inline-block'-oplossing werkt inderdaad voor de games, echter wilde ik dit ook toepassen voor alles wat in mijn counter staat. Maar als ik dat doe krijg ik dit:

De code die hierbij hoort:
https://jsfiddle.net/wzgk0pu6/
Hoe kan het dat die button dan ineens eronder staat?

En er zal zeker nog veel mis zijn met mijn HTML-opbouw, maar ik vond zo'n design via Photoshop coderen met mijn basiskennis interessanter dan allemaal tutorials volgen, omdat ik zo zelf dingen ontdek waar ik tegenaan loop. :@ Dit neem ik ook allemaal mee naar mijn volgende design!

En wat bedoel je met teveel ID's? Want ik gebruik toch geen zelfde ID's op verschillende items?

Met de rest gaat het wel lukken en bedankt voor je hulp! _O_
  zondag 24 januari 2016 @ 23:50:25 #219
118011 BrainOverfloW
Fok! around the Clock!
pi_159370971
quote:
0s.gif Op zondag 24 januari 2016 21:24 schreef Maikkeyy het volgende:
Bedankt voor je reactie!

Hier kan ik voorlopig zeker wel verder mee vooruit! :+
Ik denk dat ik de mogelijkheden van CSS heb onderschat, want na je vorige post ben ik het gaan aanpassen en hij ziet er hetzelfde uit met CSS zonder plaatje. ^O^
Ik dacht altijd maar dat al die effecten die ik in Photoshop maak niet mogelijk waren in CSS, maar dat is dus zeker niet zo.
Dat is inderdaad al enige jaren niet meer het geval. CSS heeft steeds meer complexere stijlen gekregen om je site op te tuigen. Juist omdat het zoveel sneller en flexibeler is dan vaste plaatjes.

quote:
Jouw 'display:inline-block'-oplossing werkt inderdaad voor de games, echter wilde ik dit ook toepassen voor alles wat in mijn counter staat. Maar als ik dat doe krijg ik dit:
[ afbeelding ]
De code die hierbij hoort:
https://jsfiddle.net/wzgk0pu6/
Hoe kan het dat die button dan ineens eronder staat?

Omdat die button buiten de div#numbers staat. Div's zijn standaard display:block dus elk volgend element wordt naar een nieuwe regel geduwd.
quote:
En er zal zeker nog veel mis zijn met mijn HTML-opbouw, maar ik vond zo'n design via Photoshop coderen met mijn basiskennis interessanter dan allemaal tutorials volgen, omdat ik zo zelf dingen ontdek waar ik tegenaan loop. :@ Dit neem ik ook allemaal mee naar mijn volgende design!

Zo leren we het programmeren allemaal :) Van elk design of algoritme leren we weer iets nieuws wat de volgende keer beter kan.

quote:
En wat bedoel je met teveel ID's? Want ik gebruik toch geen zelfde ID's op verschillende items?
Dat doe je inderdaad niet, dus dat is op zichzelf goed. Echter heb je veel terugkomende stijlen die je aan je elementen hangt met ID's. En omdat je ID's niet mag hergebruiken, ga je je code copy/pasten om elk ID dezelfde code mee te geven.

Neem die counter. Elk nummer heeft een eigen ID met allemaal dezelfde 4 regels css. Geef je ze allemaal dezelfde class, met daar aan die zelfde 4 regels code, dan kunnen al die regels voor nummer 2 tm 9 weg. Het zelfde geld voor de dubbele komma, en die blokken in #games.

Het grote voordeel daarvan is, naast een stuk minder werk, dat als je nu besluit de font-size aan te passen je dat maar in 1 class hoeft te doen i.p.v. bij 9 ID's

Zie maar hoeveel code het scheelt: JSFiddle

Overigens kloppen al die <p> tags om je getallen ook niet. Een <p> is voor een paragraaf tekst. Die heeft dus zelf al eigenschappen om zich af te zetten van tekst om zich heen. Dit in tegen stelling tot een <span> die bedoeld is om losse stukken tekst te stijlen. Maar in dit geval hoeft er helemaal geen extra element omheen aangezien je de stijling al op de <div> hebt zitten.

quote:
Met de rest gaat het wel lukken en bedankt voor je hulp! _O_
Graag gedaan hoor :)

Ik weet niet of je al bekend bent met de DevTools van Chrome maar als je met CSS bezig bent kun je al snel niet zonder goede ontwikkel tools.

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
  maandag 25 januari 2016 @ 09:56:37 #220
230788 n8n
Pragmatisch
pi_159375064
Heb een webapp gemaakt om met arduino je huis te besturen.

http://n8n.nl/lab/home/ (nu nog met fake data)

Gebruikt een JSON object om de hele app te renderen.
Specialization is for insects”.—Robert Heinlein
  woensdag 3 februari 2016 @ 13:08:24 #222
118011 BrainOverfloW
Fok! around the Clock!
pi_159619960
quote:
Nog een mooie



smashingmag twitterde op woensdag 03-02-2016 om 12:35:09 How many items would you display in a product grid by default? Well, 800 is way too much: https://t.co/HqDCa46wL5 https://t.co/uI1NwOuVJt reageer retweet
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_159714925
Ik weet niet of ik op het juiste adres ben maar aangezien mijn vraagstelling omtrent affiliate marketing gaat, heb ik beslist om hier maar te posten.

Kan iemand mij uitleggen hoe zo'n website als allkeyshop.com/cheapshark.com is opgebouwd?

Natuurlijk werken zij met affiliates en is het gewoon pure affiliate marketing. Maar hoe hebben ze het voor elkaar gekregen wat betreft de input? Het lijkt mij sterk dat alles handmatig is ingevoerd. Dat zou ten eerste enorm lang duren. Ten tweede moet alles automatisch ge-update worden.

Is zo'n website puur en alleen mogelijk door zelf te gaan scripten of is zoiets ook mogelijk door middel van een CMS?
  woensdag 10 februari 2016 @ 08:56:04 #224
25889 Sitethief
Fulltime Flapdrol
pi_159798786
quote:
0s.gif Op zaterdag 6 februari 2016 22:41 schreef Super-B het volgende:
Ik weet niet of ik op het juiste adres ben maar aangezien mijn vraagstelling omtrent affiliate marketing gaat, heb ik beslist om hier maar te posten.

Kan iemand mij uitleggen hoe zo'n website als allkeyshop.com/cheapshark.com is opgebouwd?

Natuurlijk werken zij met affiliates en is het gewoon pure affiliate marketing. Maar hoe hebben ze het voor elkaar gekregen wat betreft de input? Het lijkt mij sterk dat alles handmatig is ingevoerd. Dat zou ten eerste enorm lang duren. Ten tweede moet alles automatisch ge-update worden.

Is zo'n website puur en alleen mogelijk door zelf te gaan scripten of is zoiets ook mogelijk door middel van een CMS?
Het lijkt me dat dit gewoon via JSON/CSV/XML geïmporteerd wordt. Zo werken de meeste prijsvergelijkers ook voor een gedeelte. De achterliggende CMS hoeft niet per se zelf gemaakt te zijn, maar de import/verwerk kant van de website wel.
Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht &gt;:)
  donderdag 11 februari 2016 @ 10:56:09 #225
403866 richolio
#MacMasterrace
pi_159830310
Ik heb in Wordpress een icon + text



Als je die icon een link geeft, dan komt er automatisch onder een link te staan. Dat is dat "/teamontwikkelaar"

Nu wil ik die link op display:none zetten, zodat de icon alsnog linkt, maar de linktekst onder weg is.

1
2
3
4
5
6
 .q_icon_with_title .icon_with_title_link > .icontekstontwikkelaar
       {
        display:none !important;
        
    }
        

Maar dit werk dus niet.. .icontekstontwikkelaar is de class die ik dit alles heb gegeven en .q_icon_with_title .icon_with_title_link zou dan staan voor die link (klopt ook)

Doe ik wat verkeerd in dit stukje?
'Richolio _O_' - tong80
LAST.FM
pi_159830417
Wat je verkeerd doet is dat je geen testcase post, zo kan niemand je helpen.

Sowieso is het raar dat die link daar verschijnt. Waarom is dat, en waarom die je daar niet wat aan ipv met CSS elementen die je niet nodig hebt te verdoezelen...
pi_159830466
quote:
0s.gif Op donderdag 11 februari 2016 10:56 schreef richolio het volgende:
Ik heb in Wordpress een icon + text

[ afbeelding ]

Als je die icon een link geeft, dan komt er automatisch onder een link te staan. Dat is dat "/teamontwikkelaar"

Nu wil ik die link op display:none zetten, zodat de icon alsnog linkt, maar de linktekst onder weg is.
[ code verwijderd ]

Maar dit werk dus niet.. .icontekstontwikkelaar is de class die ik dit alles heb gegeven en .q_icon_with_title .icon_with_title_link zou dan staan voor die link (klopt ook)

Doe ik wat verkeerd in dit stukje?
Je zal vast iets fout doen met interpreteren van de html en hoe de css daar op ingrijpt.

Maar hoe verwacht je van ons dat we je daarbij kunnen helpen als je de html niet ook post?

Het enige wat ik zou kunnen gokken is dat je ".q_icon_with_title .icon_with_title_link > .icontekstontwikkelaar" om moet draaien. Je tekst geeft me het vermoeden dat je een div.icontekstontwikkelaar hebt met daarbinnen iets met die .q_icon_with_title.
  donderdag 11 februari 2016 @ 13:32:20 #228
403866 richolio
#MacMasterrace
pi_159833892
quote:
0s.gif Op donderdag 11 februari 2016 11:03 schreef Scarlet_Dragonfly het volgende:

[..]

Je zal vast iets fout doen met interpreteren van de html en hoe de css daar op ingrijpt.

Maar hoe verwacht je van ons dat we je daarbij kunnen helpen als je de html niet ook post?

Het enige wat ik zou kunnen gokken is dat je ".q_icon_with_title .icon_with_title_link > .icontekstontwikkelaar" om moet draaien. Je tekst geeft me het vermoeden dat je een div.icontekstontwikkelaar hebt met daarbinnen iets met die .q_icon_with_title.
Ik dacht dat het waarschijnlijk alleen aan dit ene stukje css lag, wat je op het laatst zegt klopt. Echter doet hij het nog steeds niet ;(

Ik vind het lastig om de html te posten aangezien ik in Wordpress zit. Ik kan wel even inspecten.

1
2
3
 .q_icon_with_title .icon_with_title_link{
display:none;
}

Doet het :) Nu nog alleen voor een bepaalde pagina/div, want nu haalt hij het op de hele site weg. Dat is dus de .icontekstontwikkelaar die ik in Wordpress eraan heb gegeven.
'Richolio _O_' - tong80
LAST.FM
pi_159834055
.q_icon_with_title .icon_with_title_link {
display: block;
text-indent: -99999px;
overflow: hidden;
}

daarmee spelen
  donderdag 11 februari 2016 @ 13:56:42 #230
403866 richolio
#MacMasterrace
pi_159834495
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="icontextontwikkelaar wpb_column vc_column_container vc_col-sm-3">
<div class="vc_column-inner ">
<div class="wpb_wrapper">
<div class="separator  transparent   " style=""></div>
<div class='q_icon_with_title very_large circle center'>
<div class="icon_holder " style="margin: 0px 0px 32px 0px; ">
<a href="/teamontwikkelaar2" target="" class="q_icon_link">
<span data-icon-type="circle" data-icon-hover-color="#333745"  class="qode_iwt_icon_holder fa-stack fa-5x " style="font-size: 48px;border-color: #f9fafa;background-color: #f9fafa;">
<i class="qode_icon_font_awesome fa fa-code-fork qode_iwt_icon_element" style="font-size: 30px;color: rgba(51,55,69,0.14);" ></i></span></a></div>
<div class="icon_text_holder" style="">
<div class="icon_text_inner" style="">
<h4 class="icon_title" style="color: rgba(51,55,69,0.32);">Teamontwikkelaar</h4>
<p style='color: rgba(51,55,69,0.32)'>Realiseert met elk team een effectieve samenwerking</p>
<a class='icon_with_title_link' href='/teamontwikkelaar2' target='_self' style=''>Read More</a></div></div></div></div></div></div>

Ik werk in Wordpress, dus heb de paginabroncode opgezocht. Denk niet dat dit duidelijk is, maar wie weet. Je ziet iig wel dat de icontextontwikkelaar om de .icon_with_title_link enzo zit.

quote:
0s.gif Op donderdag 11 februari 2016 13:38 schreef TwyLight het volgende:
.q_icon_with_title .icon_with_title_link {
display: block;
text-indent: -99999px;
overflow: hidden;
}

daarmee spelen
Thanks! Dat werkt :) Alleen het is wel voor de hele site. Er is namelijk nog een pagina waar ik dit niet wil..
'Richolio _O_' - tong80
LAST.FM
  donderdag 11 februari 2016 @ 14:23:44 #231
403866 richolio
#MacMasterrace
pi_159835119
Ik heb het;

1
2
3
.icontextontwikkelaar .icon_with_title_link {
    display: none;
}

was de oplossing.
'Richolio _O_' - tong80
LAST.FM
pi_160224543
vraagje uit nieuwsgierigheid:

op kruidvat.nl gebruiken ze code die voorkomt, bij aanmaken account, dat je je email adres kan copy/pasten.. ik ben alleen benieuwd waar ze dit in de code hebben staan, ik kan het niet vinden ?
  vrijdag 26 februari 2016 @ 10:05:30 #233
56176 Catch22-
Ben je Blind?!
pi_160224837
quote:
0s.gif Op vrijdag 26 februari 2016 09:49 schreef mschol het volgende:
vraagje uit nieuwsgierigheid:

op kruidvat.nl gebruiken ze code die voorkomt, bij aanmaken account, dat je je email adres kan copy/pasten.. ik ben alleen benieuwd waar ze dit in de code hebben staan, ik kan het niet vinden ?
https://jsfiddle.net/4dov0naL/

meest hatelijke wat er bestaat, maar zo kan je het doen
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_160225533
quote:
11s.gif Op vrijdag 26 februari 2016 10:05 schreef Catch22- het volgende:

[..]

https://jsfiddle.net/4dov0naL/

meest hatelijke wat er bestaat, maar zo kan je het doen
Werkt niet, ik kan op drie manieren plakken in dat veld:
- rechtermuisknop, paste
- cmd+V
- drag-and-drop een stukje geselecteerde tekst

Ctrl+V werkt sowieso niet om te plakken op een mac ;)
  vrijdag 26 februari 2016 @ 10:45:31 #235
56176 Catch22-
Ben je Blind?!
pi_160225574
quote:
0s.gif Op vrijdag 26 februari 2016 10:43 schreef Scarlet_Dragonfly het volgende:

[..]

Werkt niet, ik kan op drie manieren plakken in dat veld:
- rechtermuisknop, paste
- cmd+V
- drag-and-drop een stukje geselecteerde tekst

Ctrl+V werkt sowieso niet om te plakken op een mac ;)
PoC, dat kan je ook wel afvangen. Maar je moet het niet willen, echt dom gedrag is dat.
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_160225619
quote:
11s.gif Op vrijdag 26 februari 2016 10:05 schreef Catch22- het volgende:

[..]

https://jsfiddle.net/4dov0naL/

meest hatelijke wat er bestaat, maar zo kan je het doen
helemaal mee eens, verschrikkelijk, alleen meestal werkt het wel het e.e.a. weg te halen qua ID's e.d. en dan werkt het, bij kruidvat werkte dat dus niet, vandaar dat ik specifiek benieuwd was naar hun manier van "beveiliging" (voor zover je het beveiliging kan noemen :') )
  vrijdag 26 februari 2016 @ 10:56:02 #237
56176 Catch22-
Ben je Blind?!
pi_160225765
quote:
0s.gif Op vrijdag 26 februari 2016 10:48 schreef mschol het volgende:

[..]

helemaal mee eens, verschrikkelijk, alleen meestal werkt het wel het e.e.a. weg te halen qua ID's e.d. en dan werkt het, bij kruidvat werkte dat dus niet, vandaar dat ik specifiek benieuwd was naar hun manier van "beveiliging" (voor zover je het beveiliging kan noemen :') )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
Namespace.register('ui').DisableCopy = (function($){

    'use strict';

    // reference to parent class
    var _parent = mira.core.BehaviorBase;

    // DisableCopy Class
    var DisableCopy = function(element) {

        // Call BehaviourBase constructor
        _parent.call(this,element);

        // backup content
        this._inner = this._element.innerHTML;

        // elementen toekennen
        this.$element = $(this._element);

        this.init();
    };

    // Extend from BehaviourBase
    var p = DisableCopy.prototype = Object.create(_parent.prototype);

    // Update binds
    p.init = function() {
        var self = this;

        self.$element.on("cut copy paste", function(e){
            e.preventDefault();
        });

    };

    // Unload search behaviour
    p._unload = function() {
        // call BehaviourBase unload method
        _parent.prototype._unload.call(this);

        // restore content
        this._element.innerHTML = this._inner;

        // remove events
        this.$element.off('cut copy paste');
    };

    return DisableCopy;

}(jQuery));
Zit dus ergens in hun framework.

[ Bericht 0% gewijzigd door Catch22- op 26-02-2016 11:02:09 ]
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?
  zaterdag 27 februari 2016 @ 21:37:17 #238
230788 n8n
Pragmatisch
pi_160268720
Jezus wat een Frankenstein zooi
Specialization is for insects”.—Robert Heinlein
pi_160268868
Ik heb vééél ergere Frankenstein-zooi gezien, ik zou willen dat ieder project waar ik in zit er zo uit ziet hoor :D
Bleuh.
  zondag 28 februari 2016 @ 00:08:31 #240
134533 donroyco
dus niet Donroyco
pi_160273865
quote:
0s.gif Op zaterdag 27 februari 2016 21:40 schreef PimD het volgende:
Ik heb vééél ergere Frankenstein-zooi gezien, ik zou willen dat ieder project waar ik in zit er zo uit ziet hoor :D
Precies _O-
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. :'(
  zondag 28 februari 2016 @ 09:57:23 #241
230788 n8n
Pragmatisch
pi_160278163
quote:
0s.gif Op zaterdag 27 februari 2016 21:40 schreef PimD het volgende:
Ik heb vééél ergere Frankenstein-zooi gezien, ik zou willen dat ieder project waar ik in zit er zo uit ziet hoor :D
Ff afkloppen dan, kan nog niet heel lang JS dus heb nog geen Frankenstein legacy in het wild gespot.
Specialization is for insects”.—Robert Heinlein
  zondag 28 februari 2016 @ 10:23:42 #242
56176 Catch22-
Ben je Blind?!
pi_160278466
Ik zie alleen mijn eigen frankensteincode gelukkig. En dat ik het matige code vind van tijd tot tijd is alleen maar goed. Als je oude code ziet en denkt 'ik zou het precies zo weer doen', dan heb je niets bijgeleerd.
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_160322677
quote:
11s.gif Op vrijdag 26 februari 2016 10:56 schreef Catch22- het volgende:

[..]
[ code verwijderd ]

Zit dus ergens in hun framework.
Het enige relevante stukje is waar ze luisteren naar de cut, copy en paste events :P Zo doen ze dat dus:

https://jsfiddle.net/thebluenile/7g3nk98z/2/

Ik wist persoonlijk niet eens dat die events bestonden, maar het lijkt een redelijk goede manier om je gebruikers te irriteren :7
"You wanna be bald? Do what I did: wait a while. In the meantime, there is no excuse for running around looking like a freshly circumcised dick."
pi_160340321
Ik vind die code wel meevallen, maar die comments overal vind ik wel enorm storend.
pi_160341022
Hoe meer commentaar, hoe beter - ook al zijn sommige dingen uiteraard wel heel erg self-explanatory.
Bleuh.
  dinsdag 1 maart 2016 @ 14:56:30 #246
56176 Catch22-
Ben je Blind?!
pi_160341158
quote:
0s.gif Op dinsdag 1 maart 2016 14:51 schreef PimD het volgende:
Hoe meer commentaar, hoe beter - ook al zijn sommige dingen uiteraard wel heel erg self-explanatory.
Ik doe het te weinig, maar je moet het alleen doen als het nodig is. Dus niet bij simpele statements
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_160341230
Mwah, ik denk/vind dat commentaar niet gauw overbodig is. Ook al is het bij simpele statements zoals in het voorbeeld, dan nog kan het je helpen om de code/gedachtengang van een ander (of van jezelf!) beter te begrijpen. Maar het blijft natuurlijk persoonlijk, ieder z'n eigen voorkeur.
Bleuh.
  dinsdag 1 maart 2016 @ 15:00:37 #248
56176 Catch22-
Ben je Blind?!
pi_160341269
[code] // call BehaviourBase unload method
_parent.prototype._unload.call(this);

// restore content
this._element.innerHTML = this._inner;

// remove events
this.$element.off('cut copy paste');[/]
Dit voegt natuurlijk niets toe. Als je dit stuk code niet begrijpt zonder documentatie, ga je het met docs ook niet goed genoeg begrijpen
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_160348045
Comments moeten beschrijven wáárom je iets doet, en alleen als de code wazig is, wát je precies doet.

Vertellen dat je een class gaat openen voordat je een class opent is idd onzin.

En ja dit klinkt eenvoudig maar goeie, verduidelijkende comments icm self-explanatory code schrijven, is misschien wel een van de moeilijkste dingen als het op programmeren aan komt.
  dinsdag 1 maart 2016 @ 20:17:30 #250
56176 Catch22-
Ben je Blind?!
pi_160349513
Ik heb liever degelijke functie- en variabelenamen dan documentatie.
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_160349843
quote:
0s.gif Op dinsdag 1 maart 2016 20:17 schreef Catch22- het volgende:
Ik heb liever degelijke functie- en variabelenamen dan documentatie.
Al vind ik docblocks bij functies wel heel handig. Gewone comments moet je idd (naar mijn idee) zoveel mogelijk vermijden. Als je ze nodig hebt, is het waarschijnlijk beter om de code minder complex te maken.
pi_160352870
quote:
0s.gif Op dinsdag 1 maart 2016 14:59 schreef PimD het volgende:
Mwah, ik denk/vind dat commentaar niet gauw overbodig is. Ook al is het bij simpele statements zoals in het voorbeeld, dan nog kan het je helpen om de code/gedachtengang van een ander (of van jezelf!) beter te begrijpen. Maar het blijft natuurlijk persoonlijk, ieder z'n eigen voorkeur.
Als een regel code zonder comment erbij niet eenduidig te begrijpen is, moet je de code dusdanig anders opschrijven dat die zonder commentaar wel eenduidig te begrijpen is.

En je mag verwachten dat een lezer van je code de taal snapt, dus ga geen php constructies uitleggen in comments...
pi_160355082
quote:
0s.gif Op dinsdag 1 maart 2016 20:17 schreef Catch22- het volgende:
Ik heb liever degelijke functie- en variabelenamen dan documentatie.
Dit :Y
Ben daarom persoonlijk ook niet altijd een fan van generieke namen als getUser() setUser() zou dan eerder voor kiezen voor iets wat van toepassing is in de context van de huidige class oid.

Ik wijk er natuurlijk wel eens vanaf, maar als stelregel houd ik mezelf voor dat iemand die niet programmeert/codeert de api nog moet kunnen begrijpen.
pi_160357553
quote:
19s.gif Op dinsdag 1 maart 2016 22:48 schreef TwenteFC het volgende:

[..]

Dit :Y
Ben daarom persoonlijk ook niet altijd een fan van generieke namen als getUser() setUser() zou dan eerder voor kiezen voor iets wat van toepassing is in de context van de huidige class oid.

Ik wijk er natuurlijk wel eens vanaf, maar als stelregel houd ik mezelf voor dat iemand die niet programmeert/codeert de api nog moet kunnen begrijpen.
Programmeren. Coderen is iets heel anders.
  woensdag 2 maart 2016 @ 09:05:09 #255
56176 Catch22-
Ben je Blind?!
pi_160360921
quote:
0s.gif Op woensdag 2 maart 2016 00:01 schreef Light het volgende:

[..]

Programmeren. Coderen is iets heel anders.
Dat is echt 1 van de meest zinloze discussies die er is. Stefan kan vast wel zinnigere artikelen schrijven met zijn tijd.
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_160372516
quote:
0s.gif Op woensdag 2 maart 2016 00:01 schreef Light het volgende:

[..]

Programmeren. Coderen is iets heel anders.
Oké dan, scripten. :9
  donderdag 3 maart 2016 @ 14:31:53 #257
403866 richolio
#MacMasterrace
pi_160390945
Ik heb een probleempje. Weet niet zeker of ik hier goed zit, of of ik duidelijk genoeg ga zijn.

Oké. Ik werk dus met ExpressionEngine. Er is een archief pagina die alle entries (nieuwsberichten) laat zien. Echter zijn dat er aardig wat, niet zo overzichtelijk dus. Infinite Scroll ging niet werken, en pagination ook niet.

Dus nu wil ik dat je 20 entries ziet en als je op een knopje drukt er 20 bijkomen. (duidelijk? :@ )

Ik ben zover gekomen;

JS

1
2
3
4
5
$('.archive').each(function(i){
                $(this). 
            if(i == 20){addClass('closed')}
            
            })i

1
2
$(.archive.closed).each(
        if(i <= 20).RemoveClass(closed)

HTML (de entries)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div onclick="window.location='{site_url}nl/nieuws/{url_title}';" class="archive">
                <div class="news-heading">
                    <a href="{site_url}nl/nieuws/{url_title}" title="{title}">{exp:trunchtml chars="65" inline="..."}{title}{/exp:trunchtml}</a>
                </div>
                
                <div class="date">
                    {exp:datetime_convert language="nl_NL" format="%b %d %Y"}{entry_date}{/exp:datetime_convert}
                </div>
                <!--<div class="categorie"><b>Branche:</b> {categories}{if "{parent_id}"=="10"}<i>{category_name}</i> {/if}{/categories}</div>-->
                <!-- <div class="categorie"><b>Categorie:</b> <a href="{site_url}/nieuws/">{categories}{if "{parent_id}"=="10"}{category_name} {/if}{/categories}</a></div>-->                 
                <div class="leesmeer">
                    <a href="{site_url}nl/nieuws/{url_title}" title="{title}" class="article-link"> </a>
                </div>
              
</div>

Nu loop ik vast, want ik weet niet meer wat ik moet doen. Als er hier een betere oplossing voor is hoor ik dat ook graag :P
'Richolio _O_' - tong80
LAST.FM
pi_160392481
1onclick="window.location='{site_url}nl/nieuws/{url_title}';" 

Daar heb je een prachtig <a>-element voor...? ;-)

Als ik het goed begrijp heb je wel een gigantische lijst van HTML voor al je items en wil je alleen de eerste 20 tonen, daarna 0-40, 0-60, 0-80 etc? Dan zou je zoiets in elkaar moeten draaien. Dit is echt verschrikkelijk lelijke code, maar het gaat om het idee:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>gt demo</title>
</head>
<body>
 
 <style>
   div {
     border: 1px solid black;
   } 
   div.active {
     border-color: red;
   }
  </style>

  <button>Knopje</button>
  <script>
  
// genereer entries, dit zal normaal gesproken gewoon aan server-kant gebeuren
    var divs = [];
for(var i = 0; i<100; i++){
  var div = document.createElement('div');
  div.innerHTML = i + 1;
  document.body.appendChild(div);
  divs.push(div);
}

  var counter = 1;
  
  var button = document.querySelector('button');
  button.addEventListener('click', function(){
    counter = counter+1;
    update();
  });    
   
    var update = function(){
      divs.forEach(function(d, i){
        var action = i < (counter * 20) ? 'add' : 'remove'
        d.classList[action]('active');
      });
    };

    update();
  
</script>
</body>
</html>

http://jsbin.com/gugusutova/edit?html,css,js,output

Uiteraard moet je nog een hoop dingen afvangen, zodat je alleen maar op de knop kunt drukken als er ook echt meer items zijn etc etc.
Bleuh.
  maandag 7 maart 2016 @ 19:19:47 #259
300788 igi0n
Paraplu
pi_160496957
Heb al een geruime tijd een website draaiende (nog niet live), waar ook font-awesome op meedraait. Sinds vandaag is alleen font-awesome er ineens mee gekapt; de iconen worden niet meer geladen. Wat kan hier de oorzaak van zijn?

Heb font-awesome al geupdate (bleek al hoogste versie te zijn). Heb thema opnieuw geinstalleerd (blijft hetzelfde probleem). Het lijkt me dus dat er iets bij font-awesome is gewijzigd, of bij mijn host waardoor ze niet meer geladen worden. Iemand een idee :)?
Ik draai btw wordpress.
pi_160497619
Ik gok dat je host de eot of woff bestanden niet meer ondersteunt.

Open deze eens direct, kijken wat je krijgt.
Of check je console.
Of post je website.

Zorg iig dat je wordpress en plugins zijn geupdate.
Was recent een issue met bijvoorbeeld de 'Custom Content Type Manager' plugin.
  maandag 7 maart 2016 @ 22:44:21 #261
300788 igi0n
Paraplu
pi_160504817
quote:
0s.gif Op maandag 7 maart 2016 19:43 schreef Darkomen het volgende:
Ik gok dat je host de eot of woff bestanden niet meer ondersteunt.

Open deze eens direct, kijken wat je krijgt.
Of check je console.
Of post je website.

Zorg iig dat je wordpress en plugins zijn geupdate.
Was recent een issue met bijvoorbeeld de 'Custom Content Type Manager' plugin.
Chrome developer console geeft verder geen errors, en de plugins zijn niet veranderd sinds het niet meer werkt (werkt sowieso niet ongeacht welke plugins ik aan heb staan).
Hoe check ik of die bestanden werken? Gewoon checken vanuit de browser? Zodra ik die namelijk wil openen download die gewoon het bestand, en gebeurd er verder niets. :)

edit: gefixed, op een of andere manier was de plugin 'menu icons' de boosdoener, ongeacht of die aan stond of niet. Heb hem nu gedelete, en werkt weer :)

[ Bericht 10% gewijzigd door igi0n op 07-03-2016 22:54:36 ]
  donderdag 7 april 2016 @ 13:51:13 #262
403866 richolio
#MacMasterrace
pi_161253638
Hi,

Ik heb een simpele quiz gedownload ergens vandaan. Een deel JS ziet er zo uit;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
{"quizlist":[
  
    {
    "question":"Portuguese is spoken in _______",
    "option1":"Brazil",
    "option2":"Argentina",
    "option3":"Ecuador"
    },
    {
    "question":"What is the capital of Peru?",
    "option1":"Lima",
    "option2":"Bogota",
    "option3":"San Juan"
    },
    {
    "question":"Which country is long and thin?",
    "option1":"Chile",
    "option2":"Uruguay",
    "option3":"Colombia"
    }

]
}

Nu wil ik de "question" niet als tekst, want daarvoor in de plaats zou ik graag een afbeelding willen. Is dat mogelijk? Ik dacht misschien is daar wel een simpel tagje voor oid, maar wat ik tot nu toe heb geprobeerd heeft niet geholpen.

Thanks alvast!
'Richolio _O_' - tong80
LAST.FM
pi_161254126
Zonder de rest van je script kunnen we enkel gokken. . Je hebt nu enkel de config van je scriptne geplakt.


Wat als je gewoon image tags bij question tieft? (wel even netjes chars escapen met \)

Anders in je scriptje kijken waar die een document.write doet voor question, en IMG tags om de variabel zetten.

[ Bericht 5% gewijzigd door #ANONIEM op 07-04-2016 14:11:34 ]
pi_161446037
Zie een nieuwsbericht voorbij komen dat Visual Studio Code uit beta is en een 1.0 release heeft gekregen. Iemand van jullie die hier mee gespeeld heeft en is het de moeite waard om over te stappen? Schijnbaar toch al een half miljoen maandelijkse gebruikers en hoor dat het een stuk sneller dan Atom is.
  vrijdag 15 april 2016 @ 14:46:04 #265
56176 Catch22-
Ben je Blind?!
pi_161446080
quote:
0s.gif Op vrijdag 15 april 2016 14:44 schreef Molleman het volgende:
Zie een nieuwsbericht voorbij komen dat Visual Studio Code uit beta is en een 1.0 release heeft gekregen. Iemand van jullie die hier mee gespeeld heeft en is het de moeite waard om over te stappen? Schijnbaar toch al een half miljoen maandelijkse gebruikers en hoor dat het een stuk sneller dan Atom is.
Ik gebruik het al een tijdje. Werkt wel makkelijk.

Ik doe af en toe wat R&D met ionic2 en typescript. Er zijn niet veel windows IDE's die daar goed mee om gaan, VS Code uiteraard wel.

Ben er nu ook mee bezig. Het schort nog een beetje aan debug-feedback. Soms krijg je een wit scherm, nergens foutmeldingen en moet je maar uitzoeken wat je verkeerd doet. En dat is nogal lastig als je met nieuwe talen werkt :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_161446400
quote:
11s.gif Op vrijdag 15 april 2016 14:46 schreef Catch22- het volgende:

[..]

Ik gebruik het al een tijdje. Werkt wel makkelijk.

Ik doe af en toe wat R&D met ionic2 en typescript. Er zijn niet veel windows IDE's die daar goed mee om gaan, VS Code uiteraard wel.

Ben er nu ook mee bezig. Het schort nog een beetje aan debug-feedback. Soms krijg je een wit scherm, nergens foutmeldingen en moet je maar uitzoeken wat je verkeerd doet. En dat is nogal lastig als je met nieuwe talen werkt :P
Dit weekend eens op mijn PC en chromebook (waar linux op draait) installeren. Volgende week maar eens mee gaan experimenteren. Wordt in ieder geval voldoende aan gewerkt om het pakket beter te maken aangezien er steeds meer gebruikers komen. Vind Atom af en toe een beetje traag reageren.

Thanks.
  vrijdag 15 april 2016 @ 15:22:59 #267
91039 mstx
2x1/2 = 1/2 x 1/2
pi_161446931
quote:
0s.gif Op vrijdag 15 april 2016 14:44 schreef Molleman het volgende:
Zie een nieuwsbericht voorbij komen dat Visual Studio Code uit beta is en een 1.0 release heeft gekregen. Iemand van jullie die hier mee gespeeld heeft en is het de moeite waard om over te stappen? Schijnbaar toch al een half miljoen maandelijkse gebruikers en hoor dat het een stuk sneller dan Atom is.
Ik gebruik hem ook al een tijdje als standaard editor hier op het werk. Werkt erg prettig.
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
  dinsdag 3 mei 2016 @ 09:26:42 #268
283639 Pino0
Heeft totaal geen vooroordelen
pi_161891322
Is dit actief? Ik heb een vraag. Please quote mij
  dinsdag 3 mei 2016 @ 09:34:28 #269
56176 Catch22-
Ben je Blind?!
pi_161891434
quote:
0s.gif Op dinsdag 3 mei 2016 09:26 schreef Pino0 het volgende:
Is dit actief? Ik heb een vraag. Please quote mij
Nee morsdood
quote:
0s.gif Op vrijdag 15 april 2016 15:00 schreef Molleman het volgende:

[..]

Dit weekend eens op mijn PC en chromebook (waar linux op draait) installeren. Volgende week maar eens mee gaan experimenteren. Wordt in ieder geval voldoende aan gewerkt om het pakket beter te maken aangezien er steeds meer gebruikers komen. Vind Atom af en toe een beetje traag reageren.

Thanks.
Enige wat ik vervelend vind is dat je niet echt tabs hebt, maar daar begin ik aan te wennen.
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?
  dinsdag 3 mei 2016 @ 09:44:59 #270
283639 Pino0
Heeft totaal geen vooroordelen
pi_161891558
quote:
11s.gif Op dinsdag 3 mei 2016 09:34 schreef Catch22- het volgende:

[..]

Nee morsdood

Hoi, even een vraagje. Ben klaar met de HTML en CSS course van Codecademy, en ben nu zelf een beetje aan het stoeien, alleen kom ik al meteen een probleem tegen. Ik heb een text plaatje gemaakt in Photoshop, en die geimporteerd naar HTML/CSS, alleen wilt het plaatje gewoon niet verplaatsen, alleen als ik width invoer (maar ik wil hem gecentreerd).

Dit is mijn html code;

<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title>Result</title>
</head>
<body>
<img id="welcome"/>
<img src="C:\Users\lllll\Desktop\html\welcome01pgn.png"/>

</body>
</html>

en dit mijn CSS code

body{
background-color: #90c3d4;
}

#welcome{

position: relative;
margin-left: auto;
margin-right: auto;

}

Kan jij mij helpen?
  dinsdag 3 mei 2016 @ 09:48:16 #271
118011 BrainOverfloW
Fok! around the Clock!
pi_161891582
quote:
0s.gif Op dinsdag 3 mei 2016 09:44 schreef Pino0 het volgende:

[..]

Hoi, even een vraagje. Ben klaar met de HTML en CSS course van Codecademy, en ben nu zelf een beetje aan het stoeien, alleen kom ik al meteen een probleem tegen. Ik heb een text plaatje gemaakt in Photoshop, en die geimporteerd naar HTML/CSS, alleen wilt het plaatje gewoon niet verplaatsen, alleen als ik width invoer (maar ik wil hem gecentreerd).

Dit is mijn html code;

<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title>Result</title>
</head>
<body>
<img id="welcome"/>
<img src="C:\Users\lllll\Desktop\html\welcome01pgn.png"/>

</body>
</html>

en dit mijn CSS code

body{
background-color: #90c3d4;
}

#welcome{

position: relative;
margin-left: auto;
margin-right: auto;

}

Kan jij mij helpen?
Je img ID en src zitten in 2 verschillende tags. Die moeten samen in 1 tag. Nu centreer je een lege tag terwijl de tag met het plaatje blijft staan.
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
  dinsdag 3 mei 2016 @ 09:52:16 #272
283639 Pino0
Heeft totaal geen vooroordelen
pi_161891610
quote:
1s.gif Op dinsdag 3 mei 2016 09:48 schreef BrainOverfloW het volgende:

[..]

Je img ID en src zitten in 2 verschillende tags. Die moeten samen in 1 tag. Nu centreer je een lege tag terwijl de tag met het plaatje blijft staan.
Oja, ofcourse :') Super bedankt!

En dan heb ik nog een vraagje, ik heb ze nu allebei in 1 gedaan, maar als ik margin left en right auto doe, verspringt hij niet naar het midden. Hoe kan ik hem centreren/hoe weet ik hoeveel pixels mijn HTML bestand heeft? Om hem naar aanleiding daarvan te kunnen centreren?
  dinsdag 3 mei 2016 @ 10:00:57 #273
56176 Catch22-
Ben je Blind?!
pi_161891708
quote:
0s.gif Op dinsdag 3 mei 2016 09:52 schreef Pino0 het volgende:

[..]

Oja, ofcourse :') Super bedankt!

En dan heb ik nog een vraagje, ik heb ze nu allebei in 1 gedaan, maar als ik margin left en right auto doe, verspringt hij niet naar het midden. Hoe kan ik hem centreren/hoe weet ik hoeveel pixels mijn HTML bestand heeft? Om hem naar aanleiding daarvan te kunnen centreren?
"Give a man a fish.."

als je googled op "center img css html" dan kom je er wel uit.
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?
  dinsdag 3 mei 2016 @ 10:08:15 #274
283639 Pino0
Heeft totaal geen vooroordelen
pi_161891794
quote:
11s.gif Op dinsdag 3 mei 2016 10:00 schreef Catch22- het volgende:

[..]

"Give a man a fish.."

als je googled op "center img css html" dan kom je er wel uit.
Heb al het een en ander opgezocht, maar kwam er niet uit. Nu weer stapje verder.

Dank voor moeite.
pi_161891904
Een img tag is een inline-block element. Die kun je niet centreren met margin:auto.
Je kunt er een block element van maken met
1display:block
  dinsdag 3 mei 2016 @ 20:12:30 #276
283639 Pino0
Heeft totaal geen vooroordelen
pi_161903898
Wat doe ik verkeerd?

Ik wil gewoon een border in CSS om mijn image doen. Dit probleem heb ik ook weer gegoogled, maar kom er niet uit.


HTML
<center>
<img id="xxx" />
<img src="C:\Users\xxxx\Desktop\html\aboutme\xxxxx.jpg" height="300px" />
</center>

#xxx{
border: solid grey;
border-width: 15px;

}


Heb al geprobeerd met of zonder center etc, maar werkt niet. De border komt gewoon links onder mijn image te staan (buiten mijn image). Als ik hem bewerk in HTML krijg ik wel een border. Maar wil graag weten wat ik verkeerd doe en waarom het mij niet lukt in CSS.

Kunnen jullie mij helpen?

[ Bericht 70% gewijzigd door Pino0 op 04-05-2016 00:14:42 ]
pi_161915336
Lees eens een paar berichten terug. De fout die toen in je code zat zit er nu opnieuw in.
  woensdag 4 mei 2016 @ 10:11:06 #278
56176 Catch22-
Ben je Blind?!
pi_161916285
Begin eens met wat html en css 101 artikelen. Je hebt totaal geen basis en doet maar wat
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 4 mei 2016 @ 10:14:56 #279
12221 Tijn
Powered by MS Paint
pi_161916341
Het begint al met het feit dat je twee images op de pagina zet. Een met een id die je gebruikt in je stylesheet en eentje die daadwerkelijk naar een afbeeldingsbestand verwijst.

Je moet die twee elementen combineren.
pi_161923669
quote:
0s.gif Op zaterdag 19 december 2015 11:04 schreef pussywillow het volgende:

[..]

Ik denk dat je wel een paar weken verder bent voor je het echt onder de knie hebt. Als je gewend bent om gewoon old school DOM elementen te manipuleren dan moet je jezelf eigenlijk een andere manier van denken aanleren. Dit plaatje somt het wel mooi op :P

[ afbeelding ]
AngularJS? Nah , ReactJS *O*
Redacted
  zondag 8 mei 2016 @ 17:24:22 #281
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_162014296
Waarom selecteert dit stukje JS niet "afbeelding/Naam.jpg"?
1var img = document.getElementById("1 img").src;
1
2
3
4
<div class="content" id="1">
    <h1>Naam</h1>
    <img src="Afbeelding/Naam.jpg">
</div>
pi_162014947
Omdat getElementById een element pakt op basis van de ID. Het is dus geen selector, je kunt geen children mee geven. In jouw voorbeeld wordt er dus gezocht naar een element met de id '1 img', en niet naar een img die een child is van #1. Wat jij wilt is document.getElementById('1').querySelector('img').

Overigens mag een ID nooit beginnen met een nummer.
Bleuh.
  dinsdag 10 mei 2016 @ 08:49:59 #283
230788 n8n
Pragmatisch
pi_162054421
Of gewoon meteen querySelector("#1 img"), scheelt ook weer een dom inspectie.
Specialization is for insects”.—Robert Heinlein
  dinsdag 10 mei 2016 @ 09:04:05 #284
91039 mstx
2x1/2 = 1/2 x 1/2
pi_162054586
quote:
14s.gif Op dinsdag 10 mei 2016 08:49 schreef n8n het volgende:
Of gewoon meteen querySelector("#1 img"), scheelt ook weer een dom inspectie.
Dat hoeft niet per se sneller te zijn. getElementById is enorm snel en als je daarbinnen zoekt hoeft hij niet het hele document te doorzoeken. Niet dat je er in de praktijk veel van merkt, maar toch. ;)
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
pi_162055635
Als je toch gaat micro-optimaliseren kun je er waarschijnlijk beter getElementById('1').getElementsByTagName('img')[0] van maken.
  dinsdag 10 mei 2016 @ 10:30:41 #286
230788 n8n
Pragmatisch
pi_162055833
Met 1 query heb je nooit de null.querySelector error, het is ook explicieter wat je wilt en dom queries kosten nog een fractie van een ms tegenwoordig.
Specialization is for insects”.—Robert Heinlein
  dinsdag 10 mei 2016 @ 11:10:53 #287
56176 Catch22-
Ben je Blind?!
pi_162056715
quote:
10s.gif Op woensdag 4 mei 2016 16:35 schreef cablegunmaster het volgende:

[..]

AngularJS? Nah , ReactJS *O*
Hebben beiden hun voors en tegens. Angular2 met typescript en ionic werkt wel mooi
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_162064097
*zwaai*

Ik zoek een manier om dit te doen; ik heb links een element met een background image en rechts een nav. Als ik over de a'tjes in de nav hover wil ik eigenlijk dat de background image links verandert. :P

CSS
1
2
3
4
5
6
7
8
.hero {
  width: 50%;
  height: 100%;
  position: fixed;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, transparent 30%), url(../photo2.jpg);
  background-size: cover;
  background-position: center 30%;
}

HTML
1
2
3
4
5
6
7
8
9
<div class="projects">
     <ul>
          <li><a href="">MIJN CASE 1</a></li>
          <li><a href="">MIJN CASE 2</a></li>
          <li><a href="">MIJN CASE 3</a></li>
          <li><a href="">MIJN CASE 4</a></li>
          <li><a href="">MIJN CASE 5</a></li>
    </ul>
</div>

Niet heel relevante code nu eigenlijk, maar ik dacht misschien weten jullie een handige manier om een element (die background image/.hero) te beinvloeden door te hoveren over de nav.

Ben niet zo goed in JS, maar ik denk dat dat de enige manier is eigenlijk, dus dat is dan maar zo
  dinsdag 10 mei 2016 @ 16:44:31 #289
118011 BrainOverfloW
Fok! around the Clock!
pi_162064129
quote:
11s.gif Op dinsdag 10 mei 2016 16:42 schreef ikbenrond het volgende:
*zwaai*

Ik zoek een manier om dit te doen; ik heb links een element met een background image en rechts een nav. Als ik over de a'tjes in de nav hover wil ik eigenlijk dat de background image links verandert. :P

CSS
[ code verwijderd ]

HTML
[ code verwijderd ]

Niet heel relevante code nu eigenlijk, maar ik dacht misschien weten jullie een handige manier om een element (die background image/.hero) te beinvloeden door te hoveren over de nav.

Ben niet zo goed in JS, maar ik denk dat dat de enige manier is eigenlijk, dus dat is dan maar zo
Kun je die achtergrond niet veranderen met
1
2
3
.hero:hover{
  //nieuwe background code
}
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_162064321
quote:
0s.gif Op dinsdag 10 mei 2016 16:44 schreef BrainOverfloW het volgende:

[..]

Kun je die achtergrond niet veranderen met
[ code verwijderd ]

Jawoll, maar elke a in de nav moet een andere afbeelding krijgen. Of kan dat dan nog?
  dinsdag 10 mei 2016 @ 19:24:44 #291
118011 BrainOverfloW
Fok! around the Clock!
pi_162067846
quote:
0s.gif Op dinsdag 10 mei 2016 16:55 schreef ikbenrond het volgende:

[..]

Jawoll, maar elke a in de nav moet een andere afbeelding krijgen. Of kan dat dan nog?
Had niet helemaal goed gelezen dat je de achtergrond van een ander element wou veranderen i.p.v. de link zelf.

Is dit een beetje wat je zoekt?
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
  zaterdag 14 mei 2016 @ 15:48:38 #292
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_162181674
Waarom blijft deze code bij 'nummer' telkens '1' inserten ("<div id=nummer1>" dus), ook al klik ik meerdere keren op het addfield-divje? De var staat declared buiten de click-functie, dus die zou toch niet moeten resetten? Bovendien zou de "nummer =+ 1;" er toch 2 van moeten maken, zelfs als 'ie gereset wordt? Hij moet dus gereset worden binnen de click-functie, maar daar wordt de var helemaal niet meer gedeclared! Dat kan toch niet?

1
2
3
4
5
6
7
8
9
10
11
12
        <script>
            $(document).ready(function() {
                var nummer = 1;
                $("#addfield").click(function() {
                    nummer =+ 1;
                    var field = document.createElement('div');
                    field.setAttribute("id", "nummer"+nummer);
                    document.getElementById('teksten').appendChild(field);
                });
            });
            
        </script>
pi_162181746
quote:
0s.gif Op zaterdag 14 mei 2016 15:48 schreef Ser_Ciappelletto het volgende:
Waarom blijft deze code bij 'nummer' telkens '1' inserten ("<div id=nummer1>" dus), ook al klik ik meerdere keren op het addfield-divje? De var staat declared buiten de click-functie, dus die zou toch niet moeten resetten? Bovendien zou de "nummer =+ 1;" er toch 2 van moeten maken, zelfs als 'ie gereset wordt? Hij moet dus gereset worden binnen de click-functie, maar daar wordt de var helemaal niet meer gedeclared! Dat kan toch niet?
[ code verwijderd ]

verander =+1 eens in +=1 of beter nog nummer++;
Drop drop drop drop drop drop drop!!!! DROP!!! drop drop drop drop !!
  zaterdag 14 mei 2016 @ 15:54:42 #294
308438 Ser_Ciappelletto
Semi-professionele SJW
pi_162181802
quote:
1s.gif Op zaterdag 14 mei 2016 15:51 schreef JeSuisDroppie het volgende:

[..]

verander =+1 eens in +=1 of beter nog nummer++;
Shit, enorme faal van mij. Goed gespot! Thanks.
  zaterdag 14 mei 2016 @ 18:28:29 #295
12221 Tijn
Powered by MS Paint
pi_162185311
quote:
1s.gif Op zaterdag 14 mei 2016 15:51 schreef JeSuisDroppie het volgende:

[..]

verander =+1 eens in +=1 of beter nog nummer++;
Ik vind +=1 duidelijker dan ++ eerlijk gezegd.
pi_162186913
"Nummer" + ++nummer ^O^

please don't
pi_162199856
quote:
2s.gif Op zaterdag 14 mei 2016 18:28 schreef Tijn het volgende:

[..]

Ik vind +=1 duidelijker dan ++ eerlijk gezegd.
Kwestie van persoonlijke voorkeur imo, maar snap waar je op doelt.
Drop drop drop drop drop drop drop!!!! DROP!!! drop drop drop drop !!
  zaterdag 14 mei 2016 @ 23:48:05 #298
56176 Catch22-
Ben je Blind?!
pi_162201362
quote:
2s.gif Op zaterdag 14 mei 2016 18:28 schreef Tijn het volgende:

[..]

Ik vind +=1 duidelijker dan ++ eerlijk gezegd.
++ is wel common practice
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_162201644
quote:
2s.gif Op zaterdag 14 mei 2016 18:28 schreef Tijn het volgende:

[..]

Ik vind +=1 duidelijker dan ++ eerlijk gezegd.
+=1 is zo'n rare eend in de bijt..

alsof + gelijk aan 1 is.. (of dat + resulteert in 1)
  zaterdag 14 mei 2016 @ 23:53:39 #300
12221 Tijn
Powered by MS Paint
pi_162201796
quote:
1s.gif Op zaterdag 14 mei 2016 23:48 schreef Catch22- het volgende:

[..]

++ is wel common practice
Crockford raadt het af: http://javascript.crockford.com/code.html

quote:
Confusing Pluses and Minuses

Be careful to not follow a + with + or ++. This pattern can be confusing. Insert parens between them to make your intention clear.

total = subtotal + +myInput.value;

is better written as

total = subtotal + (+myInput.value);

so that the + + is not misread as ++. Avoid ++.
pi_162202554
Ja dus niet gebruiken zoals ik net noteerde. Gewoon Foo++; is niet zoveel mis mee lijkt me.
abonnement Unibet Coolblue
Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')