Demo :
Cara membuatnya
Dari Dashboard >> Design >> Edit HTML.
Penempatannya
dibawah ]]></b:skin>
........
diatas </head>
<style type='text/css'>
.xsmallview body{font-size: 10px;}
.smallview body{font-size: 12px;}
.normalview body{font-size: 14px;}
.largeview body{font-size: 21px;}
.xlargeview body{font-size: 24px;}
a.texttoggler{margin-right: 6px;}
a.texttoggler img{border: 1px solid gray;}
a.texttoggler img:hover{border: 1px solid red;}
a.selectedtoggler img{border: 1px solid red;}
</style>
<script type="text/javascript" src="http://pagenano.googlecode.com/files/besar%20dan%20kecil%20huruf.js"></script>
Penempatannya
dibawah <body>
........
diatas </body>
<a href="#" class="texttoggler" rel="xsmallview" title="extra small size"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUQRWmeJXbbQqliEDd7bpXl-XUJHi6ay0roS4hPhIrNr9pzezqWA_YQSTp82ZvIkjbn1FW2V5aV8vqrWzoNwM09QUTWaRuu77CKLldIxmE1Q2sLCummYecbkNCumaR8gqIGeuL3MFq0c94/s104/xsmallview.png" /></a>
<a href="#" class="texttoggler" rel="smallview" title="small size"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjw_dCwqVRFFgkq6POegK2h2K65hr9Lw9sd6veFJPOD8Gr3LIqbfp8awur0WQDzbrKDxI5BTVLtKFl6zYxvptIpBk7ehQyksNK5zcwTFAxViWB4X2ArnqiPx2yh1ZqEppFHng1vyyIgH_py/s104/smallview.png" /></a>
<a href="#" class="texttoggler" rel="normalview" title="normal size"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-mifEebEGDYuwAlyn3hPVnJi6HqkoUWM3z2ZHiM3X-cW3-wdMmJNiBtWsLKnZRdacqKDkyA2ldi1IOJM6vIh3jFAwePMxahNbkopG70AaXSIxUzhztA0CzjQfO0dgknF3k6nWRVffrj7n/s104/normalview.png" /></a>
<a href="#" class="texttoggler" rel="largeview" title="large size"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPlCs2-VZ34e2p5Zrm3jRgrpqaQ5yjNP8D48qjjJanc2Vg4VcMkAadwADAjYadF0oTeVeVWZsheYdoDOoyA71TYJ2wJzaMJS4soLLFow8XSCJ7k1bY8yiFc9tvL05SxWAlnByCCai8-fh2/s104/largeview.png" /></a>
<a href="#" class="texttoggler" rel="xlargeview" title="extra large size"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtCWwcgCptZdk_kXeyWpJU8dFYqiO4iFye9CqoR1lXVAYfcBRIjhS-pRRrqjSBjwYqDwbENeNHOC8Nxe8sc76elDvJbczjEHWhSsp0cDpxgvakrSsMlzGt_Ja2DofJ-o1XOaPcd1AX8EYS/s104/xlargeview.png" /></a>
<script type="text/javascript">
//documenttextsizer.setup("shared_css_class_of_toggler_controls")
documenttextsizer.setup("texttoggler")
</script>
Credit : JavaScript Kit
Alhamdulillah
0 comments:
Posting Komentar