WIDGET ΓΙΑ ΑΥΞΟΜΕΙΩΣΗ ΜΕΓΕΘΟΥΣ ΑΝΑΡΤΗΣΕΩΝ

ΑΠΟ ΤΟ LOCUSBLOGUS ΤΟΥ ΦΙΛΟΥ ΔΗΜΗΤΡΗ

Σήμερα έχω να μοιραστώ μαζί σας ένα καταπληκτικό widget. Τι κάνει αυτό το widget; Όπως βλέπετε στην εικόνα έχουμε μια εικόνα η οποία απεικονίζει Α- και A+. Πατώντας συνεχώς το Α+ αυξάνεται το μέγεθος της γραμματοσειράς που απαρτίζει την ανάρτηση. Πατώντας το Α- συνεχώς τα γράμματα μικραίνουν συνεπώς και η ανάρτηση. Είναι ένα χρήσιμο εργαλείο για πολλούς αναγνώστες που έχουν κάποιο πρόβλημα με την όραση τους. Το βρήκα στο bloghacktips.blogspot.com και η προσθήκη του είναι πανεύκολη.
Μπείτε στο λογαριασμό του blogspot σας και από εκεί πάτε πανόπτης, διάταξη, προσθήκη gadget και HTML/JavaScript (Layout>Add a Gadget>HTML/JavaScript). Κάντε αντιγραφή - επικόλληση (copy - paste) τον παρακάτω κώδικα και πατήστε αποθήκευση (save).

<script language="JavaScript" src="http://bloghacktips.googlepages.com/font.js"></script><div class="central" style="width: 80; height: 19"><span style="font-family:Arial;"><b><br /><br /><a href="javascript:decreaseFontSize();">A-</a><span style="font-size: 200%"> <a href="javascript:increaseFontSize();">A+</a></span></b></span></div><a href="http://bloghacktips.blogspot.com/2009/04/font-size-is-always-problem-for-blogger.html"><span style="font-size: 70%"></span></a>

UPDATE: Επειδή κάποιοι συνάντησαν δυσκολίες με το συγκεκριμένο trick θα αναφέρω άλλους δυο τρόπους για το πως θα επιτευχθεί η αυξομείωση των fonts στο blog.
Αν θέλετε να έχετε κουμπί αυξομείωσης όπως το παρακάτω screenshot:


βάλτε τον παρακάτω κώδικα όπως κάθε άλλο gadget:

Change Text Size<br/> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='.5em'"><span >+</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='1em'"><span >+</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='1.5em'"><span >+</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='2em'"><span >+</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='2.5em'"><span >+</span></a>

Αν θέλετε τα κουμπιά αυξομείωσης να δείχνουν όπως το παρακάτω screenshot:


βάλτε τον παρακάτω κώδικα όπως κάθε άλλο gadget:

Change Text Size<br/>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='.5em'"><span >Small</span></a>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='1em'"><span >Medium</span></a>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='1.5em'"><span >Large</span></a>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='2em'"><span >Larger</span></a>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='2.5em'"><span >Largest</span></a>