[HTML, CSS, JS] Frontend #44: 0 === -0

DIG Digital Corner

Alles wat je altijd al over computers, hardware, software, internet en elektronische gadgets had willen weten, maar niet op Tweakers.net durft te vragen.

Je bent niet ingelogd. Klik hier om in te loggen of hier om een gratis account aan te maken.

actieve topics nieuwe topics

abonnement Unibet Coolblue

actieve topics nieuwe topics

abonnement Unibet Coolblue

dinsdag 1 maart 2016 @ 20:28:21 #251

Light

quote:
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.

fokstok.nl

dinsdag 1 maart 2016 @ 21:51:50 #252

Scarlet_Dragonfly

draakje

quote:
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...

dinsdag 1 maart 2016 @ 22:48:20 #253

TwenteFC

quote:
Op dinsdag 1 maart 2016 20:17 schreef Catch22- het volgende:
Ik heb liever degelijke functie- en variabelenamen dan documentatie.

Dit

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.

woensdag 2 maart 2016 @ 00:01:17 #254

Light

quote:
Op dinsdag 1 maart 2016 22:48 schreef TwenteFC het volgende:

[..]

Dit
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.

fokstok.nl

woensdag 2 maart 2016 @ 09:05:09 #255

Catch22-

Ben je Blind?!

quote:
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?

woensdag 2 maart 2016 @ 18:34:15 #256

TwenteFC

quote:
Op woensdag 2 maart 2016 00:01 schreef Light het volgende:

[..]

Programmeren. Coderen is iets heel anders.

Oké dan, scripten.

donderdag 3 maart 2016 @ 14:31:53 #257

richolio

#MacMasterrace

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="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

'Richolio _O_' - tong80
LAST.FM

donderdag 3 maart 2016 @ 15:51:53 #258

PimD

Nee.

1	onclick="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

igi0n

Paraplu

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.

maandag 7 maart 2016 @ 19:43:53 #260

Darkomen

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

igi0n

Paraplu

quote:
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

richolio

#MacMasterrace

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

donderdag 7 april 2016 @ 14:11:13 #263

#ANONIEM

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 ]

vrijdag 15 april 2016 @ 14:44:46 #264

Molleman

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

Catch22-

Ben je Blind?!

quote:
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

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?

vrijdag 15 april 2016 @ 15:00:13 #266

Molleman

quote:
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

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

mstx

2x1/2 = 1/2 x 1/2

quote:
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

Pino0

Heeft totaal geen vooroordelen

Is dit actief? Ik heb een vraag. Please quote mij

dinsdag 3 mei 2016 @ 09:34:28 #269

Catch22-

Ben je Blind?!

quote:
Op dinsdag 3 mei 2016 09:26 schreef Pino0 het volgende:
Is dit actief? Ik heb een vraag. Please quote mij

Nee morsdood

quote:
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

Pino0

Heeft totaal geen vooroordelen

quote:
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

BrainOverfloW

Fok! around the Clock!

quote:
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

Pino0

Heeft totaal geen vooroordelen

quote:
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

Catch22-

Ben je Blind?!

quote:
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

Pino0

Heeft totaal geen vooroordelen

quote:
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.

dinsdag 3 mei 2016 @ 10:15:25 #275

pixarnl

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

1	display:block

actieve topics nieuwe topics

abonnement Unibet Coolblue

Forum Opties
Forumhop:
Hop naar:	(afkorting, bv 'KLB')

» digital corner

» digital corner