abidibo.net
Months has passed since my last post (work, travels, marriage...) so now an easy one before detoxing myself from internet and programming and enjoying my journey to South Africa.
Let's see a way to implement the scroll to top and scroll to bottom buttons with mootools.
Today I was playing (really working) with a nice animation effect to use for the pagination of a showcase module (or stories).
The concept is quite simple here, we have some items which iterates with a nice effect (fade in this case) automatically or not (decided through options). Every item has a dot controller which shows the item when clicked.
Nothing exceptional here, the cool thing is the effect that I gave to such dot controllers, as it seems that when clicking a not selected dot, the selected one moves forward or backward to reach the clicked point.
Quite difficult ...
Ok, the release 0.2 of moogallery is out!, Check out the updated demo here.
The new release offers some new interesting features:
Maybe in the future I'll integrate a listener for the changes in the device orientation so that the gallery reloads recalculating the available dimensions. Such thing may be already done manually.
Check out the new release and comment here to let me know which improvements you'd add to the plugin.
Wow, the first post of the last year of the world...
In the last weeks I've discovered the importance of the semantics rules applied to the web documents (well, really I knew it before, but I had never given it the importance it has).
The html5 specification introduces some new interesting html elements which plays a leading rule in this sense. Here I speak about some of them since many and many articles may tell you the same story and probably in a better way, look at this for example.
With the older html4 and XHTML the semantic structure of the page was determined essentially by the title tag in the head of the document and by all the h1..h6 tags in the body, which all represents an headline in a descendant order. In particular if you wanted to have a semantic structure with only one external root element you had to use only one h1 element. Then you had to use the others (in descendant order) to create semantics subsections.
The html5 specification introduces some semantic elements which may be used to create more complex semantic structures, and solve some situations that couldn't be managed earlier ...
jeff-flatpage is a jeff module that lets you store simple "flat" HTML content in a database and handles the management for you via jeff’s admin interface. It is the right module to use for the creation of "About" or "Privacy Policy" type pages, which don't need a specific module and implementation.
So it's ready! The first jeff module for the management of HTML contents is available for the download in the otto github account, release v1.0.
Let's see the main features:
Please for complete instructions about the module installation refer to the README file of the github repository.
Please comment here for general considerations, use the proper github area for bug reporting.
Enjoy it ;)
Sometimes I like playing with html5 and javascript. Today I was playing around with a sort of paint project for mootools. Clearly I used the html5 canvas element and I wrote some tools (pencil, rectangle, ...) to draw in it.
Well, one of the first problems encountered is the need for a undo/redo functionality. Let's see a way to implement such thing.
Essentially when drawing we can imagine we pass through a series of different states. Each state represents the canvas aspect at that time. Clearly we have a continuous set of states, but it would be to "expensive" to consider and implement this way.
So we may consider a discrete set of states, where a new state is created consequentially to a user action (and not time dependent). Let's consider the creation of a new state consequent to a mousedown-mouseup action of the user, in other words a new state is created when the user draws something in one move.
Now imagine to consider three categories: past, present and future.
The present category includes only the present ...E' online la release 0.1 di mooTree, un plugin javascript che inserisce automaticamente i controlli per espandere/comprimere i rami di un albero infinito rappresentato tramite una lista html non ordinata (ul tag).
I controlli possono essere facilmente personalizzati con poche righe di css. Il behavior iniziale, ovvero quali rami espandere/collassare inizialmente è controllabile tramite opzioni di classe, data-attributes e classi css (per l'item selezionato).
Per saperne di più vi invito a leggere la pagina del progetto, per capire subito meglio di cosa si tratta, visitate la pagina demo.
E' online la release 0.1 di mooReadAll, un plugin javascript per troncare contenuto html mantenendo la formattazione corretta.
Che c'è di nuovo direte voi, da sempre i CMS gestisono questa cosa e ci sono svariate funzioni php o python che lo fanno... Vero, ma questo plugin ottiene lo stesso risultato clientside! Dunque se non avete modo di mettere mano al sorgente, al linguaggio server etc... potete comunque troncare contenuti troppo lunghi usando questo script che lavora solo clientside!
mooReadAll è altamente e facilmente configurabile, sia nel comportamento che nella grafica. Quest'ultima è totalmente controllabile tramite css, il pacchetto comprende già un css di base con delle immagini che potete modificare a vostro piacimento.
Per quanto riguarda il comportamento, la caratteristica principale di mooReadAll è quella di consentire diversi tipi di azione in seguito al click sul classico link "leggi tutto", in particolare:
Mr ans Mrs, señores y señoras the first release of the Jeff Wiki is ready. It contains some sections that covers almost all the development stuffs:
Explains the system requirements
Explains how to install Jeff and get ready with it. jeff is a php framework but has also some CMS characteristics so that after installation it's possible to surf to a default index page and the default administrative area.
This is a tour in the process that led to the document page rendering. Starting from the entry point,index.php, and ending with the single method output ...
Ogni webmaster si trova a dover vestire dei siti di test per farli vedere ai propri clienti. Naturalmente in fase di definizione del progetto è difficile che si disponga già dei contenuti definitivi che ospiterà il sito, quindi quello che si fa è creare delle pagine ricche di Lorem ipsum e compagnia bella. Per fare questo esistono siti e addons che generano un numero variabile di paragrafi di testo che possiamo copiare ed incollare nei nostri layout.
Ma che dire delle immagini?
Capita spesso di dover utilizzare dei placeholder all'interno dei propri layout, e se vogliamo qualcosa di diverso dalle classiche immagini a sfondo pieno con le dimensioni scritte sopra lorempixum ci viene in aiuto.
Si tratta di un sito che ci permette di generare al volo immagini random di dimensioni completamente custom da inserire come placeholder. E' sufficiente chiamare l'url http://www.lorempixum.com passando le dimensioni (width, height) dell'immagine che vogliamo generare, ad esempio:
http://www.lorempixum.com/400/300
ci genera un'immagine larga 400px ed alta 300.
Allora proviamo ad inserire qui due immagini affiancate con questo metodo (ad ogni ricaricamento pagina dovreste visualizzare un'immagine diversa)
Your Smartwatch Loves Tasker!
Bootstrap 5 has come, currently in beta release, and seems already very stable.
So the question is: are you looking for ...
Let's see an example of exercise you can face during a job interview, and let's use it to understand some ...
The Pearson correlation coefficient is a measure of the linear correlation between two variables X and Y. It has a ...