Buon viaggio

Tweet

L’arma segreta si chiama jQuery.Grazie al cielo, esiste l'Open Source

Ovviamente qui parlerò di come rapportarsi a jQuery e illustrerò potenzialmente l’intero processo che ci porta da utilizzatori di codice esistente a sviluppatori di potenzialità limitate solo dalla nostra creatività (tempo permettendo, ovvio .

jQuery non è (non era, ok, è del 2006 la prima uscita stabile in pubblico) un linguaggio nuovo, ma un modo nuovo di scrivere codice JavaScript pulito e veloce.

<script src="NomeFilejQueryUtilizzato.js"></script>

Posso dividere gli step da seguireÈ una mia semplificazione, facile da ricordare. per utilizzarlo nel modo più veloce:

1. Ottenere un file .js contenente il framework jQuery e copiarlo in una cartella del sito ( attualmente è http://code.jquery.com/jquery-1.7.1.min.js) o ancora meglio usarlo con google.load(“jquery”, “1.7.1″);
2. Collegarlo nella pagina web con

   <script src="NomeFilejQueryUtilizzato.js"></script>

3. “Lanciare” il software (traduzione: chiamare la funzione che ci serve, sfruttando appunto i nomi, i metodi ecc messi a disposizione da jQuery), ad esempio:
   $(“a”).click(function(event){
   event.preventDefault();
   // preventDefault() è il nome della funzione usata
   // date un’occhiata qui http://api.jquery.com/event.preventDefault/
   $(this).hide(“slow”);
   });

http://jqueryui.com/jquery-1.6.2.js

http://jqueryui.com/ui/jquery.ui.core.js

http://jqueryui.com/ui/jquery.ui.widget.js

http://jqueryui.com/ui/jquery.ui.mouse.js

http://jqueryui.com/ui/jquery.ui.resizable.js

#resizable { width: 150px; height: 150px; padding: 0.5em; } // il div

#resizable h3 { text-align: center; margin: 0; } // il titolo del contenitore

.ui-resizable-helper { border: 1px dotted gray; } // interessante visualizzazione personalizzata dell'elemento nell'atto del ridimensionamento.

Ed infine chiamiamo la funzione ( fase 3, ricordate? ).

<script>
	$(function() {
		$( "#resizable" ).resizable({
			animate: true
		});
	});

</script>

Tweet

I vantaggi stanno in un più leggero peso dell’effetto e nel funzionamento indipendentemente dai vari blocchi di sicurezza, gli svantaggi ovviamente nella non perfetta compatibilità tra i browsers (basare la forza di un layout sulle transitions può essere una lama a doppio taglio).

L’utilizzo è facile, si dice quali sono le proprietà dello stile che subiscono l’effetto e si impostano diversamente nel caso di stato Normale ed in quello di Hover, per esempio.

Partiamo da una transition di base su un link

HTML
<a href='http://www.marcotramontano.com'>Link verso un bel blog</a>

CSS
a {
color: #666;
margin-left:0px;
transition-property:color, margin-left; <------ proprietà
transition-duration:1s; <----- parametro opzionale, la durata
}

a:hover {

color:#9C9;

margin-left:10px;

}

Questo è l’effetto

Ovviamente impostate anche i vari -o-, -moz- e -webkit- che “per fortuna” avranno gli stessi nomi ed argomenti (o per Opera, moz per Firefox, webkit per Safari e Chrome)

Se poi vi va di approfondire allora…

.quadrato{
background-color: #CCCCCC;
width: 200px;
height: 100px;
padding:10px;
transition-property: background-color, width, height;
transition-duration: 2s, 1s, 3s;
transition-timing-function: ease-in, linear, ease-out;
transition-delay: 1s, 2s, 1s;
-webkit-transition-property: background-color, width, height;
-webkit-transition-duration: 2s, 1s, 3s;
-webkit-transition-timing-function: ease-in, linear, ease-out;
-webkit-transition-delay: 1s, 2s, 1s;
-o-transition-property: background-color, width, height;
-o-transition-duration: 2s, 1s, 3s;
-o-transition-timing-function: ease-in, linear, ease-out;
-o-transition-delay: 1s, 2s, 1s;
-moz-transition-property: background-color, width, height;
-moz-transition-duration: 2s, 1s, 3s;
-moz-transition-timing-function: ease-in, linear, ease-out;
-moz-transition-delay: 1s, 2s, 1s;
}
.quadrato:hover{
background-color: #99FF99;
width: 100px;
height: 200px;
padding:10px;
}

Ovviamente così è più uno Spaghetti Code che un buon esercizio ma sta sempre a noi capire quando fermarci e come usare le innovazioni.

Ci sono degli esempi online bellissimi, provate a capire quanto jQuery c’è e quanto è solo con i Css3.

Buona lettura e, mi raccomando, condivisione.

AGGIORNAMENTO del 14/12/2011: Ovviamente appena ho tempo parlerò anche delle “animation” in css3, praticamente gli effetti senza rollover

Tweet

Il 26 Ottobre 2011, il deputato Lamar Smith ed un gruppo bipartisan di 12 sponsor hanno presentato alla Camera negli U.S.A. il S.O.P.A., lo Stop Online Piracy Act, un disegno di legge che rafforza la capacità delle forse di controllo statunitensi di combattere le violazioni sul Copyright e il traffico sulle merci contraffatte.

Bellissima idea, sulla carta, peccato che poi la realtà sia, come sempre, un po’ più oscura del previsto.

Il motivo è semplice: in presenza di un dubbio sulla legittimità di un atto su un sito web, si può richiedere un’ordinanza del tribunale per cancellare il contenuto, bloccare il sito stesso, eliminare i servizi offerti, bloccarne i risultati in un motore di ricerca, con una velocità impensabile prima d’ora, colpendo persino gli ISP (internet service provider) che non operino in tal senso.

In parole povere il semplice sospetto di violare un copyright potrebbe giustificre l’inserimento in una blacklist che porterebbe al possibile oscuramento del sito.

Persino Kaspersky Lab prende le distanze dall’iniziativa USA, preannunciando l’uscita dalla BSA ( Business Software Alliance) dal Gennaio 2012.

Avete idea di cosa voglia dire rischiare anche 5 anni solo per avere condiviso un link di un brano che vi piace? Anni fa la chiamavano censura, ora, come sempre, la chiamano “misura necessaria”.

E vogliamo parlare dei software open source, il cui codice aperto è così suscettibile di critica e di dubbi che Mozilla ha rischiato già quest’anno per via di alcuni suoi plug-in di condivisione?

Immaginate anche che un dominio sitocarino.blog.com venga chiuso per via di un errore di condivisione o di “un ragionevole dubbio”, tutti i siti *.blog.com verrebbero cancellati.Immaginate Google offline perché una sola delle quasi infinite pagine indicizzate hanno qualcosa che non va…

Un pò come usare un lanciarazzi per colpire una zanzara.

Non so voi, ma io ho sempre avuto paura delle guerre preventive e della tolleranza zero.

Se volete contribuire potete dare un’occhiata su http://americancensorship.org/ per capirne di più e per contribuire a lasciare il web libero e controllabile.

Che ne pensate? Potete scrivere anche sul blog o sulla pagina di facebook.

E state attenti a cosa scrivete… non si sa mai…

Tweet

Chris Hondros ha passeggiato, corso, sofferto, fotografato ed emozionato in Kosovo, Angola, Sierra Leone, Lebanon, Afghanistan, Kashmir, the West Bank, Iraq, and Liberia.

Misurata – Sono due i giornalisti rimasti uccisi oggi a Misurata, secondo quanto riferiscono alcuni media. Si tratta di Tim Hetherington e Chris Hondros, di 41 anni, e lavora per l’agenzia fotografica Getty.

I quattro reporter si trovavano in gruppo sulla Via Tripoli, la principale arteria di Misurata, la città a circa 200 chilometri ad est della capitale assediata da quasi due mesi dalle forze fedeli a Muammar Gheddafi. L’arteria è l’epicentro dei combattimenti fra governativi e insorti.

Fonte: http://www.ilsecoloxix.it

Era il 20 Aprile 2011 quando un mortaio a Misurata, in Libia, ha portato via il loro sguardo sul nostro mondo.

Ed è a loro che quest’anno il World Press Photo dedica la propria edizione.
Anche quest’anno la più importante mostra itinerante farà tappa a Napoli, luogo in cui è nato Pietro Masturzo, napoletano, che ha scattato la foto vincitrice a Teheran, il 24 giugno 2009, immortalando alcune donne che nella notte gridano dal tetto di un edificio di Teheran, in segno di protesta contro il regime, nella notte successiva alle contestate elezioni presidenziali.

Quest’anno la foto che è stata giudicata, a ragione, la più significativa ed importante è stata quella della sudafricana Jodi Bieber, pubblicata sul «Time»il primo Agosto 2011, foto che ha vinto tra l’altro anche la categoria «Ritratti individuali».

La foto ritrae la Bibi Aisha, una ragazza afgana appena diciottenne sfigurata dal marito perché andata via di casa.

Informazioni:

Dall’8 Dicembre 2011 al 4 Gennaio 2011
World Press Photo 2011 – Napoli PAN[Palazzo delle Arti Napoli] – Via dei Mille
Chiuso il Martedì
biglietti: 5,00 €
www.worldpressphoto.it / www.neapolisart.org

Tim Hetherington
 http://www.timhetherington.com/mentalpicture/home/176

Chris Hondros
http://www.chrishondros.com 

Tweet

Ciao, mondo! / Hello, world!

Anche se in principio era invece

ciao, mondo / hello, world

e derivava da

main() {
printf("hello, world\n");
}

Beh, se credete sia poco importante saperlo o se pensate che d’importante c’è solo il font usato per dirlo, allora odierete questo blog e ne parlerete malissimo su tutti i social network.

Se invece siete quel tipo di persone che con curiosità, passione ed entusiasmo assaporano la vita, il design e tutte le forme di comunicazione esistenti, come un buon vino o un bel vinile appena comprato, allora avete trovato il luogo adatto dove condividire il vostro punto di vista sulle cose che amate.

Ovviamente siete tutti i benvenuti su “A part of me”.

“There is only one thing in the world worse than being talked about, and that is not being talked about”.

The Picture of Dorian Gray.

Tweet