CSS, small caps και ελληνικά: Μια javascript λύση

21 05 2008

Ίσως ήδη γνωρίζετε ότι στα ελληνικά η χρήση CSS Small Caps είναι απαγορευμένη εξαιτίας των τόνων που παραμένουν και στα κεφαλαία. Προσωπικά, λατρεύω τα Small Caps για επικεφαλίδες. Θεωρώ ότι δίνουν ένα αρκετά φινετσάτο, κομψό και μοντέρνο στυλ (ε ψιτ, εσύ που διαφωνείς και ξινίζεις τη μούρη σου αυτή τη στιγμή: γούστα είναι αυτά :P ).

Οπότε σήμερα που τα χρειάστηκα, δεν υπήρχε περίπτωση να τα αφήσω εξαιτίας αυτού του προβλήματος. Οπότε σκέφτηκα μια απλή javascript λύση, που σίγουρα έχει αρκετά περιθώρια βελτίωσης:

window.onload = function() {
	var SCClassName = "smallcaps";

	var elem = document.getElementsByClassName(SCClassName);
	for(var i=0; i<elem.length; i++)
	{
		elem[i].innerHTML = elem[i].innerHTML.replace(/ά/g,"α");
		elem[i].innerHTML = elem[i].innerHTML.replace(/Ά/g,"Α");
		elem[i].innerHTML = elem[i].innerHTML.replace(/ή/g,"η");
		elem[i].innerHTML = elem[i].innerHTML.replace(/Ή/g,"Η");
		elem[i].innerHTML = elem[i].innerHTML.replace(/ί/g,"ι");
		elem[i].innerHTML = elem[i].innerHTML.replace(/Ί/g,"Ι");
		elem[i].innerHTML = elem[i].innerHTML.replace(/ύ/g,"υ");
		elem[i].innerHTML = elem[i].innerHTML.replace(/Ύ/g,"Υ");
		elem[i].innerHTML = elem[i].innerHTML.replace(/έ/g,"ε");
		elem[i].innerHTML = elem[i].innerHTML.replace(/Έ/g,"Ε");
		elem[i].innerHTML = elem[i].innerHTML.replace(/ό/g,"ο");
		elem[i].innerHTML = elem[i].innerHTML.replace(/Ό/g,"Ο");
		elem[i].innerHTML = elem[i].innerHTML.replace(/ώ/g,"ω");
		elem[i].innerHTML = elem[i].innerHTML.replace(/Ώ/g,"Ω");
	}
}

(το window.onload = χάριν απλούστευσης, στην πράξη δεν θα έπρεπε να αντιστοιχείτε με αυτό τον τρόπο events στο onload, διότι δεν θα μπορείτε να αντιστοιχίσετε πολλά, από διαφορετικά scripts)

Επεξηγήσεις:

Όπου “smallcaps”, θα βάλετε το όνομα της δικής σας class που περιέχει font-variant: small-caps;. Δυστυχώς, επί του παρόντος δεν υποστηρίζονται περισσότεροι selectors παρά μόνο classes.

Για να χρησιμοποιήσετε το παραπάνω χρειάζεστε και μια συνάρτηση getElementsByClassName(). Θεωρώ ότι ήδη θα έχετε κάποια που προτιμάτε, αν όχι με ένα google search θα βρείτε πολλές.

Αλήθεια, έχει κανείς κάποια ιδέα για να γίνει πιο αποδοτικό; Φοβάμαι ότι τα τόσα replace θα είναι αργά σε μεγάλα κείμενα…

ΥΓ: Με ρώτησαν διάφοροι αν παράτησα το blog, λόγω της μακράς μου απουσίας. Δεν το παράτησα, και ούτε πρόκειται. Απλά είναι η φύση του τέτοια, που δεν είναι στο χέρι μου να γράφω συχνά, ούτε θέλω να το γεμίσω σκουπίδια, απλώς για να γράφω συχνά. :-)


Ενέργειες

Πληροφορίες

3 απαντήσεις

23 05 2008
spirosdoikas

Κι εμένα μου αρέσουν τα small caps :)

Βλέπω ωστόσο σε πολλά σημεία στα css του WordPress:
text-transform:uppercase;

Με αποτέλεσμα να εμφανίζεται ΑΡΧΙΚΉ ΣΕΛΊΔΑ, κ.ά.
Αντίστοιχο πρόβλημα υπάρχει και στο default theme του SMF. Μια απλή λύση είναι η διαγραφή αυτής της γραμμής από τον κώδικα.

23 05 2008
leaverou

Ναι αλλά αυτό δεν λύνει το πρόβλημα, απλά αφαιρεί την αιτία που το προκαλούσε.

Όσο για το WordPress, δεν σου δίνει δυνατότητα να επεξεργαστείς το CSS, εκτός αν πληρώσεις. Δεδομένου ότι δεν θα μείνει εδώ το blog για πάνω από χρόνο, δεν έχω σκοπό να πληρώσω για κάτι τέτοιο.

24 05 2008
spirosdoikas

Ναι, δίκιο έχεις. Αγοράζεις δικό σου domain, χρησιμοποιείς το ίδιο λογισμικό και κανείς εισαγωγή όλα τα μηνύματα/σχόλια που έχεις εδώ και μετά πειράζεις τον κώδικα κατά βούληση ;)

Γράψτε ένα σχόλιο