CSS3 e Jquery: alternativa ai classici pulsanti 'leggi tutto'

Una situazione tipica di un blog o di un sito di contenuti è la presentazione di un sommario o di un'anteprima che permetta all'utente di comprendere il contenuto e quindi di accedere all'articolo completo se di suo interesse.
Molti risolvono con più o meno eleganti soluzioni grafiche di pulsanti che indicano la presenza di un contenuto esteso.
Attraverso Jquery e l'utilizzo dei CSS3 possiamo ottenere un effetto diverso dal solito, piacevole e personalizzabile con pochi interventi.
L'esempio che vi sottopongo è  composto dal file contenente i link, il css, la libreria jquery e il javascript specifico per settare gli effetti, i testi dei pulsanti e i link di destinazione.
Qui  trovate l'esempio personalizzato, per modificare i parametri dovrete intervenire sul foglio stile e sul js example.js, in particolare dalla riga 37:
$(function() {
   
    $(".widget-uno").middleBoxButton("Leggi tutto", "https://www.disign.it");
    $(".widget-due").middleBoxButton("Continua...", "https://www.improntedigitali.it");

});
La funzione definisce la classe, che deve essere applicata al div interessato, e invia i due parametri testo del pulsante e link da aprire al click.
Se necessitiamo di diversi div cliccabili con testi e link diversi sarà sufficiente aggiungere
    $(".widget-tre").middleBoxButton("testo del pulsante", "link da aprire");
etc etc.
Qui  potete scaricare il file zip dell'esempio.

La documentazione completa la trovate nel sito da cui è tratto l'esempio  CSS-tricks.