Wir verwenden Cookies zur Verbesserung der Benutzerfreundlichkeit und zum Verfolgen der Besucherströme mit Matomo (Piwik).
Mehr Infos auf der Datenschutzseite. Du kannst die Cookie-Erlaubnis jederzeit am Ende der Seite widerrufen.

capitalLetter

jQuery-Plugin - Hebt die Anfangszeichen von z.B. Absätzen hervor
 

Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen, immer im Schatten meines großen Bruders 'Lorem Ipsum', freue ich mich jedes Mal, wenn Sie ein paar Zeilen lesen.

Denn esse est percipi - Sein ist wahrgenommen werden. Und weil Sie nun schon die Güte haben, mich ein paar weitere Sätze lang zu begleiten, möchte ich diese Gelegenheit nutzen, Ihnen nicht nur als Lückenfüller zu dienen, sondern auf etwas hinzuweisen, das es ebenso verdient wahrgenommen zu werden: Webstandards nämlich. Sehen Sie, Webstandards sind das Regelwerk, auf dem Webseiten aufbauen.

 

Anwendung:

Anfangszeichen erhalten ein span class="capital-letter"
Das Plugin wirkt automatisch auf p-Tags wie im Preset zu sehen:

$("p").CapitalLetter({
    "float": "left",
    "padding": 0,
    "margin": "0 0.1em 0 0",
    "color": "#CC3300"
});


Durch Angaben in der beiligenden CSS oder direkt im Preset einfaches Styling möglich:

Ein DIV mit id stil-1.
Darunter folgt etwas Lorem auf deutsch.

 

Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen, immer im Schatten meines großen Bruders 'Lorem Ipsum', freue ich mich jedes Mal, wenn Sie ein paar Zeilen lesen.

Denn esse est percipi - Sein ist wahrgenommen werden. Und weil Sie nun schon die Güte haben, mich ein paar weitere Sätze lang zu begleiten, möchte ich diese Gelegenheit nutzen, Ihnen nicht nur als Lückenfüller zu dienen, sondern auf etwas hinzuweisen, das es ebenso verdient wahrgenommen zu werden: Webstandards nämlich. Sehen Sie, Webstandards sind das Regelwerk, auf dem Webseiten aufbauen.



CSS

#stil-1 .capital-letter { font-family: Signature; color: green }
 

Auch für Überschriften (hier h2) möglich


Preset:

$('h2').CapitalLetter({
	'font-family': 'Signature',
	'color': '#2164aa'
});

Oder CSS

h2 {font-family: Signature; color: #2164aa}




Autor: laureanoarcanio


Anzeige durch Droplet MoreLikeThis