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.
Nou, het mag sowieso niet met wordpress. |Dan wordt je plan afgewezen. Dus ik ga snel lynda af denk ik.quote:Op vrijdag 18 november 2011 15:47 schreef RenRen- het volgende:
Mooi getekend zo
[ afbeelding ]
Dit is het overzicht, met thumbnails die ik ga tekenen gok ik.
[ afbeelding ]
Als je op een thumbnail of titel klikt kom je bij het daadwerkelijke recept terecht.
Wat er dus geupload moet gaan worden is platte tekst, 2 afbeeldingen en een titel.
Verder komt er op de site nog een home met (denk ik) een slider, wat leuke artikelen uit de nieuwspagina, nieuwe recepten, dat soort dingen. Contactformulier komt er ook uiteraard, en een zoekfunctie
Ik wil een rechthoek van 720px bij 360px maken, elke pixel moet individueel aangestuurd kunnen worden. Ik had al een oplossing gemaakt in PHP die er als volgt uit ziet:
Probleem hierbij is dat er dus zo'n 260.000 divjes aangemaakt worden wat natuurlijk niet echt ten goede komt aan de snelheid/performance. Hebben jullie misschien iets van suggesties waarin ik dit het beste kan maken? jQuery of iets?
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <?php $pix=1; $divId=1; $var="px"; for($i=0; $i<360; $i ++) { for($j=0; $j<720; $j++) { echo "<div id=\"$divId\" style=\"position:absolute; height:$pix$var; width:$pix$var; background:#000000; top:$i$var; left:$j$var;\"></div>"; $divId++; } } ?> |
Probleem hierbij is dat er dus zo'n 260.000 divjes aangemaakt worden wat natuurlijk niet echt ten goede komt aan de snelheid/performance. Hebben jullie misschien iets van suggesties waarin ik dit het beste kan maken? jQuery of iets?
Wat wil je doen met al die pixels die aangestuurd kunnen worden? Ik denk dat het waarom belangrijker is om te weten, dan het hoe. 
dat dus.
In het PHP topic werd mij ook al de vraag gesteld waarom ik het niet in Canvas maak.
Alleen kom ik er niet helemaal uit bij Canvas, de enige manier die ik tot dusver heb kunnen vinden om een pixel te tekenen is als volgt:
Lijkt mij volgens mij niet de bedoeling om een simpele pixel te tekenen met een lineTo...
Ik kan ook niet echt tutorials vinden die het hebben over pixels, tutorials gaan meteen over allemaal "fancy" dingen met allemaal toeters en bellen er op.
Alleen kom ik er niet helemaal uit bij Canvas, de enige manier die ik tot dusver heb kunnen vinden om een pixel te tekenen is als volgt:
| 1 2 3 4 5 6 7 8 9 10 | <script type="text/javascript"> var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.moveTo(0,0); ctx.lineTo(1,1); ctx.stroke(); </script> |
Lijkt mij volgens mij niet de bedoeling om een simpele pixel te tekenen met een lineTo...
Ik kan ook niet echt tutorials vinden die het hebben over pixels, tutorials gaan meteen over allemaal "fancy" dingen met allemaal toeters en bellen er op.
Dat ja.quote:Op woensdag 30 november 2011 18:04 schreef QM84 het volgende:
Wat wil je doen met al die pixels die aangestuurd kunnen worden? Ik denk dat het waarom belangrijker is om te weten, dan het hoe.
Elke pixel is gelijk aan een bepaald gebied gebaseerd op gps coördinaten. Aan de hand van de gps coördinaten wil ik bijvoorbeeld met de flickr api nagaan hoeveel foto's er geposts zijn in een bepaalde tijd in dat gebied. Vervolgens moet de kleur van de pixel gebaseerd worden op het aantal geplaatste foto's in een bepaald gebied. Voorbeeld van wat mijn eindresultaat ongeveer moet gaan worden: linkquote:
Wat wil je doen met al die pixels die aangestuurd kunnen worden? Ik denk dat het waarom belangrijker is om te weten, dan het hoe.
Maar even voor de duidelijkheid, ik zit nog helemaal in de beginfase, het eerste wat ik nu wil nagaan is hoe ik op een snelle manier een rechthoek op mijn scherm tover.
Als je begint met en basiskleur en daar pixels / divs eroverheen zet om de kleur sterker te maken scheelt het al een boel pixels als je leeg begint, toch?
Daar heb je wel een goed punt inderdaad, zo'n 70% van de aarde bestaat uit water, denk dat er vanuit die gebieden niet echt gepost wordt op Flickr bijvoorbeeld. Blijft er zo'n 30% over wat land is, en van die 30% heb je dan ook nog grote gebieden waar geen activiteit is. Als ik een schatting moet maken wordt slechts 15 a 20 % van het rechthoek ingevuld met gekleurde pixels.quote:
Als je begint met en basiskleur en daar pixels / divs eroverheen zet om de kleur sterker te maken scheelt het al een boel pixels als je leeg begint, toch?
Ik ga me nu weer wat verder inlezen over wat je allemaal met HTML5 Canvas kan doen, lijkt me toch beter dan met divjes werken, als ik 20% van het rechthoek moet invullen zit ik namelijk nog steeds met +- 50.000 divjes wat natuurlijk niet echt snel is.
als pagina opbouw gebruik ik een index.php waarin ik alle pagina's include,
zodat ik maar 1 pagina met opmaak heb, die andere pagina lees ik dus via een function() in,
nu krijg ik het niet werkend om aan mijn menu een :active te geven
zou dat kunnen zijn omdat ik altijd in index.php blijf ?
kan ik toch een :active maken met bijv switch statement? ik ben ik nu te moeilijk bezig?
zodat ik maar 1 pagina met opmaak heb, die andere pagina lees ik dus via een function() in,
nu krijg ik het niet werkend om aan mijn menu een :active te geven
zou dat kunnen zijn omdat ik altijd in index.php blijf ?
kan ik toch een :active maken met bijv switch statement? ik ben ik nu te moeilijk bezig?
de :active pseudoclasse werkt alleen als de link écht actief is, maw: als je er op klikt. Om de link een andere stijl mee te geven als je op de bijhorende pagina zit, dan zal je met classes moeten werken.
Met andere woorden: in het stukje waar je je menu opbouwt, zal je elke keer moeten kijken of de GET hetzelfde is als de link, zo ja: class="active" zo niet, niets..
Met andere woorden: in het stukje waar je je menu opbouwt, zal je elke keer moeten kijken of de GET hetzelfde is als de link, zo ja: class="active" zo niet, niets..
dat dus.
maar hoe kan ik m slim die active class meegeven? met switch statement???quote:
de :active pseudoclasse werkt alleen als de link écht actief is, maw: als je er op klikt. Om de link een andere stijl mee te geven als je op de bijhorende pagina zit, dan zal je met classes moeten werken.
Met andere woorden: in het stukje waar je je menu opbouwt, zal je elke keer moeten kijken of de GET hetzelfde is als de link, zo ja: class="active" zo niet, niets..
Het hangt er ook een beetje vanaf hoe je je menu opbouwt, maar als je alle links bvb gewoon hard in je template hebt staan, krijg je zoiets:
dit is dus, als alle links hard in de code staat (niet efficiënt). Als je je menu in een tekstbestandje of een array hebt staan, of dynamisch opbouwt, kan je de paginanamen vervangen door variabelen en door de li's loopen met een while- of for-loop.
De .active kan je nautuurlijk ook op de a zelf zetten. Ik hou er zelf van om classes zo 'hoog mogelijk' te zetten: het is in CSS geen probleem om children van een element te selecteren, maar een parent selecteren zit er nog altijd niet in. Hoe hoger het 'unieke element' staat, hoe beter dus.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <?php /* ervan uitgaande dat de variabele voor de include 'p' is, natuurlijk invullen wat jij gebruikt extra controle op het bestand om te kijken of de gebruiker geen rare dingen aan de url toevoegt Met de $p weet je dus op welke pagina je zit */ if(isSet($_GET['p'] && file_exists('include/'. $_GET['p'] .'.inc.php'))) { $p = $_GET['p'] ; } ?> //In je menu gebruik je dan zoiets: <li<?php if($p=='pagename'):?> class="active"<?php endif;?>><a href="?p=paginanaam">Paginanaam</a></li> etc.. |
dit is dus, als alle links hard in de code staat (niet efficiënt). Als je je menu in een tekstbestandje of een array hebt staan, of dynamisch opbouwt, kan je de paginanamen vervangen door variabelen en door de li's loopen met een while- of for-loop.
De .active kan je nautuurlijk ook op de a zelf zetten. Ik hou er zelf van om classes zo 'hoog mogelijk' te zetten: het is in CSS geen probleem om children van een element te selecteren, maar een parent selecteren zit er nog altijd niet in. Hoe hoger het 'unieke element' staat, hoe beter dus.
dat dus.
Heeft iemand werkende simpele Android en Iphone simulators? Ik wil wat oefenen met media queries en mijn resultaat snel kunnen bekijken op de twee simulators.
Goede lichte versies van een simulator lijken haast niet te vinden, wel online versies maar ik wil gewoon op mn desktop draaien eigenlijk. Iemand die toevallig deze linkjes bij de hand heeft?
Goede lichte versies van een simulator lijken haast niet te vinden, wel online versies maar ik wil gewoon op mn desktop draaien eigenlijk. Iemand die toevallig deze linkjes bij de hand heeft?
Android heeft een SDK maar die is heel traag.
met de webdevelopertoolbar van firefox kan je het scherm wel makkelijk resize naar vaste resoluties, kan je daar niet mee spelen
met de webdevelopertoolbar van firefox kan je het scherm wel makkelijk resize naar vaste resoluties, kan je daar niet mee spelen
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?
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?
Ja ik had die SDK gedownload maar wat een gedoe, veel friles, updates en dan nog krijg ik dat ding niet aan de praat. Er moet toch wel wat zijn, iets compacts, licht en geen fratsen? Tot dan maar op een klein scherm bekijken naar 't resultaatquote:Op vrijdag 2 december 2011 12:33 schreef Catch22- het volgende:
Android heeft een SDK maar die is heel traag.
met de webdevelopertoolbar van firefox kan je het scherm wel makkelijk resize naar vaste resoluties, kan je daar niet mee spelen
Het is ook vooral voor het oefenen maar toch, een echte simulator is wel fijn.
wil je mediaqueries voor het platform of de resolutie?
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?
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?
Resolutiequote:
wil je mediaqueries voor het platform of de resolutie?
Ik wil oefenen om met de CSS een website te optimaliseren voor het browsen met een mobiele telefoon. Ik wil dus gewoon simpel op een snelle manier even zien hoe alles eruit ziet op een mobiel scherm, liefst van Android en Iphone.
Niks bijzonders dus
dan moet je gewoon de webdevelopertoolbar van firefox gebruiken om de resolution aan te passen
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?
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?
Wat hij zegt ^.
Gewoon je browservenster resizen naar vaste resoluties en kijken wat het resultaat is.
Wat sowieso een aanrader is: Zodra je onder een bepaalde grens komt qua resolutie, overstappen op liquid. Dus met hoogtes en breedtes in procenten, ipv pixels. Er zijn aardig wat mobiele apparaten in omloop, die veel verschillende resoluties hebben. Om te voorkomen dat je voor ál die resoluties je ontwerp aan moet passen, of dat je een 'ideale resolutie' nodig hebt, kan je dus overstappen op liquid. Zo kan je dus 1 mobiel theme bouwen, dan gewoon altijd goed werkt op de mobiele apparaten.
Je zou evt voor tablets/netbooks, die een nét iets hogere resolutie hebben, een tussenversie kunnen maken.
Gewoon je browservenster resizen naar vaste resoluties en kijken wat het resultaat is.
Wat sowieso een aanrader is: Zodra je onder een bepaalde grens komt qua resolutie, overstappen op liquid. Dus met hoogtes en breedtes in procenten, ipv pixels. Er zijn aardig wat mobiele apparaten in omloop, die veel verschillende resoluties hebben. Om te voorkomen dat je voor ál die resoluties je ontwerp aan moet passen, of dat je een 'ideale resolutie' nodig hebt, kan je dus overstappen op liquid. Zo kan je dus 1 mobiel theme bouwen, dan gewoon altijd goed werkt op de mobiele apparaten.
Je zou evt voor tablets/netbooks, die een nét iets hogere resolutie hebben, een tussenversie kunnen maken.
dat dus.
Denk erom dat Android moeite heeft met mediaqueries als je geen <meta name="viewport" content="(whatever)"> gebruikt. Heeft me veel gekut gevonden om daar achter te komen .
.
Oh, en de Samsung Galaxy S2 heeft in landscape mode een breedte van 545px, ik targete nog steeds op 480px maar dat is niet meer genoeg.
Daarom dus liquid voor mobilequote:Op vrijdag 2 december 2011 13:42 schreef picodealion het volgende:
Oh, en de Samsung Galaxy S2 heeft in landscape mode een breedte van 545px, ik targete nog steeds op 480px maar dat is niet meer genoeg.
En inderdaad, de viewport-metatag toevoegen:
| 1 | <meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
dat dus.
Ik snap echt niets van die jQuery Cycle Plugin, iemand die mij daarbij kan helpen?
Ik krijg het niet voor elkaar een mooie fade aan mijn foto's toe te voegen, welke code moet ik nu gebruiken en waar moet ik die neer plempen?
Ik krijg het niet voor elkaar een mooie fade aan mijn foto's toe te voegen, welke code moet ik nu gebruiken en waar moet ik die neer plempen?
bij de download zitten demos, daar moet je ff kijken hoe de demo met fade wordt aangeroepen
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?
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?
Ja dat probeer ik, maar ik snap er niets van.quote:
bij de download zitten demos, daar moet je ff kijken hoe de demo met fade wordt aangeroepen
ik ben ook de lulligste niet en heb hem hier op mijn hd staan dus ik kijk voor je
fx: 'fade'
als argument
fx: 'fade'
als argument
| 1 2 3 | $('.slideshow').cycle({ fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc... }); |
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?
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?
Okay die resize optie is inderdaad wel okay maar het geeft niet echt de feel. Maar dat zie ik dan wel even door de vingers.
vanaf hoeveel width/height zou je dan voor liquid gaan trouwens? Waar ligt voor je gevoel de grens?
vanaf hoeveel width/height zou je dan voor liquid gaan trouwens? Waar ligt voor je gevoel de grens?
Het hangt er een beetje vanaf van wat voor site ik aan het bouwen ben en wat het doel ervan is, maar meestal onder de 800px ga ik volledig liquid. Voor > 800 en <1000 een fixed layout, waarbij kolommen verspringen, en 1000 - 1200 ook weer liquid in dat gebied, omdat heel veel mensen wel een groter scherm hebben dan 1024px in de breedte, maar niet iedereen (plus iPad in landscape!); Maar op een fullHD-scherm is 1000px ook weer zo smal, dus vandaar de oprekking naar 1200, waar het gros nu ongeveer op zit qua schermbreedte. Zodra je nog breder gaat werken, heb je echt een volledig nieuw siteontwerp nodig qua kolom- en informatieopbouw, omdat mensen gewoon niet gemaakt zijn om zoveel informatie naast elkaar te verwerken; mensen houden van smalle kolommen en dingen in de lengte ipv breedte.quote:
vanaf hoeveel width/height zou je dan voor liquid gaan trouwens? Waar ligt voor je gevoel de grens?
Maar.... dit is dus vrij persoonlijk / contextafhankelijk / doelgroepafhankelijk.
dat dus.
