[HTML, CSS, JS] Frontend #41: De Node is hoger

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
pi_142633844
Ik zit weer een bootstrap-template te implementeren. Nu zou ik nooit zelf zo'n gelikte layout kunnen produceren, maar echt. Ik moet kotsen van mijn eigen code ;(.
zcflevo.nl
pi_142657193
quote:
9s.gif Op woensdag 23 juli 2014 13:12 schreef KomtTijd... het volgende:
Ik zit weer een bootstrap-template te implementeren. Nu zou ik nooit zelf zo'n gelikte layout kunnen produceren, maar echt. Ik moet kotsen van mijn eigen code ;(.
;(

Een troost:

Ik probeerde een 1-pagina site te implementeren zonder extern framework (behalve JQuery) omdat ik dacht dat ik het nog wel kon overzien. Helaas een fout gebleken. Aparte pagina's zijn veel makkelijker in het onderhoud. Nu is veel wel in aparte pagina's die door middel van $('selector').load() worden geladen maar het is toch niet helemaal hetzelfde.

Plus ik moet op een goede manier de history bijhouden met pushState en dergelijke.
  woensdag 23 juli 2014 @ 22:15:51 #153
56176 Catch22-
Ben je Blind?!
pi_142658376
quote:
9s.gif Op woensdag 23 juli 2014 13:12 schreef KomtTijd... het volgende:
Ik zit weer een bootstrap-template te implementeren. Nu zou ik nooit zelf zo'n gelikte layout kunnen produceren, maar echt. Ik moet kotsen van mijn eigen code ;(.
ben toch benieuwd wat je doet, want ik vind t relatief clean als ik het doe. Maar ik ben dan ook niet iemand die paniekeert als een element vier classes heeft
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_142671019
quote:
9s.gif Op woensdag 23 juli 2014 13:12 schreef KomtTijd... het volgende:
Ik zit weer een bootstrap-template te implementeren. Nu zou ik nooit zelf zo'n gelikte layout kunnen produceren, maar echt. Ik moet kotsen van mijn eigen code ;(.
Ja kut is dat he. Zelfde met Foundation overigens, zit me een partij .row's en .column.large-n te nesten waar je ziek van wordt. Ben er nog steeds niet over wanneer ik gewoon moet besluiten om het gekozen framework even te negeren en gewoon zelf een paar regels css erbij te pleuren.
pi_142671116
quote:
1s.gif Op woensdag 23 juli 2014 22:15 schreef Catch22- het volgende:

[..]

ben toch benieuwd wat je doet, want ik vind t relatief clean als ik het doe. Maar ik ben dan ook niet iemand die paniekeert als een element vier classes heeft
ja rationeel maakt het ook geen zak uit, maar ik vind het gewoon lelijk. Alleen de code voor het menu is al 3x zo lang geworden terwijl ik het zelfde zou kunnen bereiken met enkel css. Alleen kost me dat een jaar omdat ik er niet goede in ben :7.
zcflevo.nl
  donderdag 24 juli 2014 @ 09:30:29 #156
166255 Maringo
Bèhèhèhèh
pi_142671173
quote:
1s.gif Op donderdag 24 juli 2014 09:27 schreef KomtTijd... het volgende:

[..]

ja rationeel maakt het ook geen zak uit, maar ik vind het gewoon lelijk. Alleen de code voor het menu is al 3x zo lang geworden terwijl ik het zelfde zou kunnen bereiken met enkel css. Alleen kost me dat een jaar omdat ik er niet goede in ben :7.
Als je menu drie keer zo lang is, dan doe je toch iets niet goed, lijkt me. Maar dat kan ook aan je bootstraptheme liggen. Een beetje theme zorgt ervoor dat je alleen een ul met li's hebt en dan zorgt een bepaalde class in de ul voor de gehele opmaak.
Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.
  donderdag 24 juli 2014 @ 09:42:50 #157
56176 Catch22-
Ben je Blind?!
pi_142671422
Ik vind onderhoudbaarheid belangrijker dan een paar kB op je css file. Daar merk je toch niets van (als het niet de spuigaten uitloopt)
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_142671564
FontAwesome _O_
pi_142671805
quote:
3s.gif Op donderdag 24 juli 2014 09:30 schreef Maringo het volgende:

[..]

Als je menu drie keer zo lang is, dan doe je toch iets niet goed, lijkt me. Maar dat kan ook aan je bootstraptheme liggen. Een beetje theme zorgt ervoor dat je alleen een ul met li's hebt en dan zorgt een bepaalde class in de ul voor de gehele opmaak.
Nouja je wilt er ook een icoontje bij ofzo. Had prima met li::after gekund natuurlijk maar nu is het <i class=" fa fa-angle-right"></i> in de HTML. Plus inderdaad 100 classnames per element. Natuurlijk maakt het allemaal geen zak uit, maar de autist in mij houdt er niet van :P

quote:
11s.gif Op donderdag 24 juli 2014 09:42 schreef Catch22- het volgende:
Ik vind onderhoudbaarheid belangrijker dan een paar kB op je css file. Daar merk je toch niets van (als het niet de spuigaten uitloopt)
Dit geldt ook inderdaad. Het is wel lekker makkelijk allemaal zo.
zcflevo.nl
  donderdag 24 juli 2014 @ 10:10:41 #160
56176 Catch22-
Ben je Blind?!
pi_142671946
quote:
7s.gif Op donderdag 24 juli 2014 09:50 schreef Scorpie het volgende:
FontAwesome _O_
Gebruik ik ook al een tijdje, echt ideaal. Heb er een handige mixin voor geschreven voor Less. If interested wil ik hem wel delen :)
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_142672230
quote:
11s.gif Op donderdag 24 juli 2014 10:10 schreef Catch22- het volgende:

[..]

Gebruik ik ook al een tijdje, echt ideaal. Heb er een handige mixin voor geschreven voor Less. If interested wil ik hem wel delen :)
Wij gebruiken hier SASS maar je mag hem altijd delen natuurlijk :)
  donderdag 24 juli 2014 @ 10:27:37 #162
56176 Catch22-
Ben je Blind?!
pi_142672344
quote:
7s.gif Op donderdag 24 juli 2014 10:22 schreef Scorpie het volgende:

[..]

Wij gebruiken hier SASS maar je mag hem altijd delen natuurlijk :)
Maakt weinig uit, volgens mij kan je hem 1:1 kopieren. Als FontAwesome een Sass versie heeft iig.
Mixin
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		@primary-color: #B63918;
@iconSize: 17px;
.make-icon(@var, @color: @primary-color) {    
    &:before {
        .fa; 
        padding-right:5px;
        color:@color;
        font-size:@iconSize;  
        content:(@var);
    } 
}
.reset-icon() {    
    &:before {
        .fa;
        padding-right:0;        
        content:' ';
    } 
}
.rotate-icon() {
    &:before {
    .fa-rotate-90;
    
    }
}
.make-icon-after(@var, @color: @primary-color) {    
    &:after { 
        .fa;
        padding-left:5px;
        color:@color;
        font-size:@iconSize;
        content:(@var);
    }
} 
Gebruik
1
2
3
4
5
6
7
8
9
10
11
12
13
14		a.action {
    .make-icon(@fa-var-adjust);
    &.moveUp, &.moveup {
        .make-icon(@fa-var-arrow-circle-o-up);
    }
    &.moveDown, &.movedown {
        .make-icon(@fa-var-arrow-circle-o-down);
    }
//etc
   &.sub {
        .make-icon(@fa-var-level-up);
        .rotate-icon();
    }
}
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_142672435
quote:
11s.gif Op donderdag 24 juli 2014 10:27 schreef Catch22- het volgende:

[..]

Maakt weinig uit, volgens mij kan je hem 1:1 kopieren. Als FontAwesome een Sass versie heeft iig.
Mixin
[ code verwijderd ]

Gebruik
[ code verwijderd ]

Ja dat heeft maar een paar kleine aanpassingen nodig voor SASS.
  donderdag 24 juli 2014 @ 10:35:16 #164
56176 Catch22-
Ben je Blind?!
pi_142672548
quote:
14s.gif Op donderdag 24 juli 2014 10:30 schreef Scorpie het volgende:

[..]

Ja dat heeft maar een paar kleine aanpassingen nodig voor SASS.
Ja, het is niet superhoogstaand of spannend, maar dit scheelde mij veel ergernis. Je hebt alleen dan 2 classes nodig voor een icon, maar dat levert wel nettere css op. En als je een icon + onopgemaakte class gebruikt zie je het adjust icoon, weet je gelijk dat je dat nog moet fiksen :)
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 24 juli 2014 @ 11:26:58 #165
230788 n8n
Pragmatisch
pi_142674052
quote:
11s.gif Op donderdag 24 juli 2014 10:27 schreef Catch22- het volgende:

[..]

Maakt weinig uit, volgens mij kan je hem 1:1 kopieren. Als FontAwesome een Sass versie heeft iig.
Mixin
[ code verwijderd ]

Gebruik
[ code verwijderd ]

waarom (als je toch px gebruikt) niet 16px voor de icons. Volgens mij zijn ze op 16px 'getekend' dus ook scherper.

De keren dat ik fontawesome gebruik maak ik zelf de classes. Een .icon voor algemeen en dan een naam bij de inhoud waar het icoon nodig is.

Dus .icon:before {
content: "";
…
}

.user:before {
content: "\xxxx";
}

Als ik dan nog zin heb maak ik nog een subset van het font. Vind overbodige bits maar vies. Keer een html uglyfier maken met php en daar ook de css mee laten parsen :+

[ Bericht 27% gewijzigd door n8n op 24-07-2014 11:32:01 ]
“Specialization is for insects”.—Robert Heinlein
  donderdag 24 juli 2014 @ 11:40:01 #166
56176 Catch22-
Ben je Blind?!
pi_142674444
Omdat ze dan beter passen in de rest van de site. Ik maak het mij zelf graag makkelijk. En op zo'n manier dat als ik over een half jaar onderhoud moet doen, ik ook nog graag snap wat er staat.
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 24 juli 2014 @ 11:42:56 #167
166255 Maringo
Bèhèhèhèh
pi_142674518
quote:
1s.gif Op donderdag 24 juli 2014 11:26 schreef n8n het volgende:

[..]

waarom (als je toch px gebruikt) niet 16px voor de icons. Volgens mij zijn ze op 16px 'getekend' dus ook scherper.
Niet per sé voor 16px meer in v3:
http://fortawesome.github.io/Font-Awesome/3.2.1/icons/
Klik maar op een icoon, dan zie je ook de grotere versies.
Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.
  donderdag 24 juli 2014 @ 12:37:55 #168
230788 n8n
Pragmatisch
pi_142676288
quote:
2s.gif Op donderdag 24 juli 2014 11:42 schreef Maringo het volgende:

[..]

Niet per sé voor 16px meer in v3:
http://fortawesome.github.io/Font-Awesome/3.2.1/icons/
Klik maar op een icoon, dan zie je ook de grotere versies.
groter kon altijd al, punt was dat de iconen oorspronkelijk gemaakt zijn op 16 bij 16 pixels, ze zien er derhalve het scherpst uit op 16 bij 16 pixels of een vermenigvuldiging daarvan al zal het vanaf 32px steeds minder opvallen.
“Specialization is for insects”.—Robert Heinlein
  donderdag 24 juli 2014 @ 12:42:15 #169
230788 n8n
Pragmatisch
pi_142676429
http://n8n.nl/lab/osx/?si(...)ht&wallpaper=default

Early stage projectje naar aanleiding van de nieuwe OS X en het hele retina versus schalen verhaal. Een OS zou prima responsive/schaalbaar moeten kunnen. Je kan de grootte aanpassen door de get value in de url aan te passen.

(over een venster met je muis laat 'm verdwijnen, komt na 2 tellen terug, is om de animatie te testen)
“Specialization is for insects”.—Robert Heinlein
pi_143193206
_O_
quote:
Microsoft To Drop Support For Older Versions of Internet Explorer
After January 12, 2016, only the most recent version of Internet Explorer available for a supported operating system will receive technical support and security updates. For example, customers using Internet Explorer 8, 9, or 10 on Windows 7 SP1 should migrate to Internet Explorer 11 to continue receiving security updates and technical support.

From the blog post: "Microsoft recommends enabling automatic updates to ensure an up-to-date computing experience—including the latest version of Internet Explorer—and most consumers use automatic updates today. Commercial customers are encouraged to test and accept updates quickly, especially security updates.

Regular updates provide significant benefits, such as decreased security risk and increased reliability, and Windows Update can automatically install updates for Internet Explorer and Windows."
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
  vrijdag 8 augustus 2014 @ 11:10:16 #171
56176 Catch22-
Ben je Blind?!
pi_143193246
IE7 en lager kan me sowieso de pijp blazen. In IE8 zorg ik dat het werkt, meer niet.
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_143193302
quote:
11s.gif Op vrijdag 8 augustus 2014 11:10 schreef Catch22- het volgende:
IE7 en lager kan me sowieso de pijp blazen. In IE8 zorg ik dat het werkt, meer niet.
Had 6 maanden terug nog een klant van een klant waarbij Bootstrap in een enkel geval crashte op IE7 ;( (halve middag debuggen).

Zou mooi zijn als IE11 het minimum wordt.
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
  vrijdag 8 augustus 2014 @ 16:30:42 #173
166255 Maringo
Bèhèhèhèh
pi_143203451
Wij doen alleen nog maar IE9+. Dat scheelt al een hoop zorgen.
Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.
  vrijdag 8 augustus 2014 @ 16:34:41 #174
56176 Catch22-
Ben je Blind?!
pi_143203567
Als je voor bedrijven werkt aan interne systemen is het helaas nog nodig om IE8 te supporten
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_143204036
IE8 :r
pi_143213955
quote:
7s.gif Op vrijdag 8 augustus 2014 16:49 schreef Scorpie het volgende:
IE8 :r
  zaterdag 9 augustus 2014 @ 19:45:46 #177
125913 Devolution
Beep beep Richie
pi_143238787
Bij ons moet de site zelfs werken in IE7. Het gaat hier wel om de basis, dus als een elementje een paar pixels naar rechts staat of er minder mooi uit ziet (bijv geen transparency) dan maakt dat niet uit. Als de functionaliteit maar hetzelfde is als op IE8+.
"You know what Hell really is? It's not lakes of burning oil or chains of ice. It's being removed from God's sight."
  zaterdag 9 augustus 2014 @ 20:46:43 #178
56176 Catch22-
Ben je Blind?!
pi_143240626
In contracten staat standaard huidige versies major browser tot een versie terug. Ie8 en lager support betaalt de klant voor. Maar ik zorg altijd dat alles in ie8 werkt.

Pixelperfect doe ik sowieso niet aan. Is namelijk een utopie en niet van toepassing op applicaties
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 10 augustus 2014 @ 10:28:31 #179
230788 n8n
Pragmatisch
pi_143253366
Kort JS vraagje: in browsers in OS X krijg je met window.pageYOffset een negatieve waarde als je omhoog scrolled omdat de pagina bounced (standaard in het OS). Krijg je deze negatieve waarde standaard in browsers als je 'voorbij' 0 door blijft scrollen of is dat alleen vanwege dat bounce gebeuren in OS X?
“Specialization is for insects”.—Robert Heinlein
  zondag 10 augustus 2014 @ 10:30:05 #180
230788 n8n
Pragmatisch
pi_143253393
quote:
7s.gif Op vrijdag 8 augustus 2014 16:49 schreef Scorpie het volgende:
IE8 :r
het nieuwe IE6

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.
“Specialization is for insects”.—Robert Heinlein
pi_143413413
Hoi een vraagje ik zit het boek " PHP, MySQL, JavaScript & HTML5 All-in-One For Dummies" te lezen hehe. En daarin volg een tutorial hoe je wat javascript validatie kan schrijven voor een form. Alleen wanneer ik een regel leeg laat, dan hoort hij een error te laten zien zoals op deze afbeelding weergegeven:

De afbeelding komt trouwens van het pdf.

Het probleem is wanneer ik een lege form verstuur dat ik die errors niet krijg. Hier is mijn code:

form.php link:
http://pastebin.com/j3v8AWVB

form.js link:
http://pastebin.com/2YCbPDqH

Naar mijn mening ziet de code er goed uit. En ik weet echt niet waar het aan ligt. Kan iemand me misschien helpen? Alvast bedankt voor uw antwoord :) !
pi_143414280
quote:
0s.gif Op donderdag 14 augustus 2014 14:48 schreef superky het volgende:
Hoi een vraagje ik zit het boek " PHP, MySQL, JavaScript & HTML5 All-in-One For Dummies" te lezen hehe. En daarin volg een tutorial hoe je wat javascript validatie kan schrijven voor een form. Alleen wanneer ik een regel leeg laat, dan hoort hij een error te laten zien zoals op deze afbeelding weergegeven:
[ afbeelding ]
De afbeelding komt trouwens van het pdf.

Het probleem is wanneer ik een lege form verstuur dat ik die errors niet krijg. Hier is mijn code:

form.php link:
http://pastebin.com/j3v8AWVB

form.js link:
http://pastebin.com/2YCbPDqH

Naar mijn mening ziet de code er goed uit. En ik weet echt niet waar het aan ligt. Kan iemand me misschien helpen? Alvast bedankt voor uw antwoord :) !
Begin eens met Chrome te werken.
  donderdag 14 augustus 2014 @ 15:43:20 #183
118011 BrainOverfloW
Fok! around the Clock!
pi_143415309
quote:
0s.gif Op donderdag 14 augustus 2014 14:48 schreef superky het volgende:
Hoi een vraagje ik zit het boek " PHP, MySQL, JavaScript & HTML5 All-in-One For Dummies" te lezen hehe. En daarin volg een tutorial hoe je wat javascript validatie kan schrijven voor een form. Alleen wanneer ik een regel leeg laat, dan hoort hij een error te laten zien zoals op deze afbeelding weergegeven:
[ afbeelding ]
De afbeelding komt trouwens van het pdf.

Het probleem is wanneer ik een lege form verstuur dat ik die errors niet krijg. Hier is mijn code:

form.php link:
http://pastebin.com/j3v8AWVB

form.js link:
http://pastebin.com/2YCbPDqH

Naar mijn mening ziet de code er goed uit. En ik weet echt niet waar het aan ligt. Kan iemand me misschien helpen? Alvast bedankt voor uw antwoord :) !
Je gebruikt verkeerde quotes. Je hebt aparte open en sluiten ” in plaats van ". Zowel bij de single als de double quotes. Browsers lezen alleen de " goed.

Als je chrome gebuikt kun je in de DevTools snel zien dat dit fout gaat.


[ Bericht 6% gewijzigd door BrainOverfloW op 14-08-2014 15:53:51 ]
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_143418379
Ja xD mijn fout wat stom van me..
  donderdag 14 augustus 2014 @ 17:32:29 #185
118011 BrainOverfloW
Fok! around the Clock!
pi_143418870
quote:
0s.gif Op donderdag 14 augustus 2014 17:17 schreef superky het volgende:
Ja xD mijn fout wat stom van me..
Zo leren we allemaal van onze fouten ;)
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
  vrijdag 15 augustus 2014 @ 10:25:28 #186
230788 n8n
Pragmatisch
pi_143439672
quote:
0s.gif Op donderdag 14 augustus 2014 15:43 schreef BrainOverfloW het volgende:

[..]

Je gebruikt verkeerde quotes. Je hebt aparte open en sluiten ” in plaats van ". Zowel bij de single als de double quotes. Browsers lezen alleen de " goed.

Als je chrome gebuikt kun je in de DevTools snel zien dat dit fout gaat.
[ afbeelding ]
single dumb quotes ook: '. Gebruik ik zelf altijd bij php/js. Vind het makkelijker lezen en het combineert makkelijker met html
“Specialization is for insects”.—Robert Heinlein
  vrijdag 15 augustus 2014 @ 10:30:19 #187
56176 Catch22-
Ben je Blind?!
pi_143439749
Dat is een smaakkwestie (single of double), als je het maar consequent doet.
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_143439773
quote:
7s.gif Op vrijdag 8 augustus 2014 16:49 schreef Scorpie het volgende:
IE8 :r
Gister nog een hoop gedoe dat klant niet kon inloggen op het CMS, blijkt dat te komen door IE8, het is echter een grote financieele instelling, en die zijn jaren bezig geweest met een upgrade naar IE8, kortom upgrade naar windows 7 duurt nog minimaal 6 jaar.
🕰️₿🕰️₿🕰️₿🕰️₿🕰️₿🕰️ TikTok next Block
  vrijdag 15 augustus 2014 @ 10:37:54 #189
230788 n8n
Pragmatisch
pi_143439904
quote:
11s.gif Op vrijdag 15 augustus 2014 10:30 schreef Catch22- het volgende:
Dat is een smaakkwestie (single of double), als je het maar consequent doet.
true that.

Heb trouwens (tatatada) m'n eerste zelfstandige js gemaakt. Wel vervelend dat als je begonnen bent je meer leert en zo hele stukken opnieuw aan het doen bent.

Heb alleen geen requestanimationframe weten te implementeren (al werkt het op 60fps op m'n 2011 laptop).

http://www.n8n.nl/lab/fok/presentation/action.js (ff een link, zit mobiel, pardon).
Vragen/Opmerkingen?
“Specialization is for insects”.—Robert Heinlein
  vrijdag 15 augustus 2014 @ 10:43:29 #190
56176 Catch22-
Ben je Blind?!
pi_143440009
Ziet er wel netjes uit zo :)

Mijn eerste app draait nu live. Meteor (Node-based dus) api en een Android en iOs Cordova-powered app (die in de appstores staan)
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 augustus 2014 @ 10:47:33 #191
230788 n8n
Pragmatisch
pi_143440096
quote:
11s.gif Op vrijdag 15 augustus 2014 10:43 schreef Catch22- het volgende:
Ziet er wel netjes uit zo :)

Mijn eerste app draait nu live. Meteor (Node-based dus) api en een Android en iOs Cordova-powered app (die in de appstores staan)
nice! Had echt een shitstorm verwacht :+

app store al doorgekomen? Staat (nog) niet in de eerste 10 resultaten
“Specialization is for insects”.—Robert Heinlein
  vrijdag 15 augustus 2014 @ 19:15:54 #192
118011 BrainOverfloW
Fok! around the Clock!
pi_143455008
quote:
14s.gif Op vrijdag 15 augustus 2014 10:25 schreef n8n het volgende:

[..]

single dumb quotes ook: '. Gebruik ik zelf altijd bij php/js. Vind het makkelijker lezen en het combineert makkelijker met html
Klopt. Ik doelde ook op dat type quotes, wist alleen niet dat ze zo heten. Gebruik zelf ook het liefst de single quotes.
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 16 augustus 2014 @ 00:23:17 #193
230788 n8n
Pragmatisch
pi_143467026
quote:
1s.gif Op vrijdag 15 augustus 2014 19:15 schreef BrainOverfloW het volgende:

[..]

Klopt. Ik doelde ook op dat type quotes, wist alleen niet dat ze zo heten. Gebruik zelf ook het liefst de single quotes.
komt nog uit de tijd van de typemachine, toen waren dubbele functies voor toetsen lastig/onmogelijk en combineerden ze “ en ” naar ". Nu weet niemand beter en gebruikt men in teksten nog steeds de ‘domme’ quotes terwijl " en ' eigenlijk voor tijdsnotering en afmetingen zijn ;(
“Specialization is for insects”.—Robert Heinlein
pi_143480366
heb het al./

[ Bericht 30% gewijzigd door BroodjeKebab op 16-08-2014 15:50:27 ]
  zaterdag 16 augustus 2014 @ 15:50:44 #195
134533 donroyco
dus niet Donroyco
pi_143480527
quote:
0s.gif Op zaterdag 16 augustus 2014 15:45 schreef BroodjeKebab het volgende:
[ afbeelding ]

[ afbeelding ]

[ afbeelding ]

Die 9292 blijft daar vast op die positie, wat ik ook doe... wat moet ik doen? Hij reageert gewoon op niks..
Je class niet laten beginnen met (een) cijfer(s).
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_143484710
Ik heb een code gevonden (hover/mouse over CSS) en ik zou graag deze willen toepassen op de IMG (images) die ik op mijn website heb. Wat moet ik erbij zetten om het werkend te krijgen?

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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126		/* Hover Shadow */
@-webkit-keyframes hover {
  50% {
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
  }

  100% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
}

@keyframes hover {
  50% {
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
  }

  100% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
}

@-webkit-keyframes hover-shadow {
  0% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }

  50% {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }
}

@keyframes hover-shadow {
  0% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }

  50% {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }
}

.hover-shadow {
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.hover-shadow:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}
.hover-shadow:hover, .hover-shadow:focus, .hover-shadow:active {
  -webkit-transform: translateY(-6px);
  transform: translateY(-6px);
  -webkit-animation-name: hover;
  animation-name: hover;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}
.hover-shadow:hover:before, .hover-shadow:focus:before, .hover-shadow:active:before {
  opacity: .4;
  -webkit-transform: translateY(6px);
  transform: translateY(6px);
  -webkit-animation-name: hover-shadow;
  animation-name: hover-shadow;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}
pi_143484820
quote:
0s.gif Op zaterdag 16 augustus 2014 18:18 schreef BroodjeKebab het volgende:
Ik heb een code gevonden (hover/mouse over CSS) en ik zou graag deze willen toepassen op de IMG (images) die ik op mijn website heb. Wat moet ik erbij zetten om het werkend te krijgen?
[ code verwijderd ]

Dat zou ik niet doen ;-) een hele jaap CSS je code in jagen terwijl je niet weet wat het doet.
mijn advies?

1
2
3
4		img:hover
{
  border:4px solid #00ff00; /* TEST */
}

:-) vanuit daar uitbouwen naar wat je wilt hebben
Vooral dat wat hier boven staat.
pi_143485327
quote:
7s.gif Op zaterdag 16 augustus 2014 18:23 schreef amvrosios het volgende:

[..]

Dat zou ik niet doen ;-) een hele jaap CSS je code in jagen terwijl je niet weet wat het doet.
mijn advies?
[ code verwijderd ]

:-) vanuit daar uitbouwen naar wat je wilt hebben
Top dankje! Ik had nog één vraag:

Ik heb de volgende background:

http://www.hadewallpapers(...)ckground-image-css-3

Maar zoals je ziet herhaalt hij zich:



Hoe kan ik zorgen dat die zich niet herhaalt, maar dan ook wel fullscreen is?

pi_143485381
quote:
0s.gif Op zaterdag 16 augustus 2014 18:40 schreef BroodjeKebab het volgende:

[..]

Top dankje! Ik had nog één vraag:

Ik heb de volgende background:

http://www.hadewallpapers(...)ckground-image-css-3

Maar zoals je ziet herhaalt hij zich:

[ afbeelding ]

Hoe kan ik zorgen dat die zich niet herhaalt, maar dan ook wel fullscreen is?

[ afbeelding ]
1<body style="background-image:hout.jpg; background-repeat:no-repeat;">

Al zou ik de styling persoonlijk niet inline doen ;-)
je kan het beter in een losse stylesheet kieperen om je code maintable te houden
Vooral dat wat hier boven staat.
  zaterdag 16 augustus 2014 @ 18:42:53 #200
134533 donroyco
dus niet Donroyco
pi_143485393
quote:
0s.gif Op zaterdag 16 augustus 2014 18:40 schreef BroodjeKebab het volgende:

[..]

Top dankje! Ik had nog één vraag:

Ik heb de volgende background:

http://www.hadewallpapers(...)ckground-image-css-3

Maar zoals je ziet herhaalt hij zich:

[ afbeelding ]

Hoe kan ik zorgen dat die zich niet herhaalt, maar dan ook wel fullscreen is?

[ afbeelding ]

Wat is dit voor prut :r

1
2
3
4
5
6
7		body {
  background: url(images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
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. :'(
actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
[HTML, CSS, JS] Frontend #41: De Node is hoger
Index

» digital corner

» development

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