seo Stylish JQuery Text Resize Buttons For Your Blogger 2013

on Monday, March 11, 2013 | 0 Comment

Seo Master present to you:

This is a special effect for your blogger. It can increase your blog text size when we are clicking on increase button. After add this widget your blog shows three button plus, minus and resize. Green plus button to increase your text size and Red minus button to decrease your text size. You can resize your text with 3rd option.This is useful program. If you want to add in your blogger. Follow this post..

Go to Template Option.

Click on Edit HTML .

Tick Expand Widget Template option above

Find (CTRL+F) </head> tag.

Copy and paste below code above </head> tag.

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>

<script>
$(document).ready(function(){
//ID, class and tag element that font size is adjustable in this array
//Put in html or body if you want the font of the entire page adjustable
var section = new Array('span','.section2');
section = section.join(',');
// Reset Font Size
var originalFontSize = $(section).css('font-size');
$(".resetFont").click(function(){
$(section).css('font-size', originalFontSize);
});
// Increase Font Size
$(".increaseFont").click(function(){
var currentFontSize = $(section).css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize, 10);
var newFontSize = currentFontSizeNum*1.2;
$(section).css('font-size', newFontSize);
return false;
});
// Decrease Font Size
$(".decreaseFont").click(function(){
var currentFontSize = $(section).css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize, 10);
var newFontSize = currentFontSizeNum*0.8;
$(section).css('font-size', newFontSize);
return false;
});
});
</script>
<!-- End Text re size gadget by www.www.matrixar.com –>

Then Find(CTRL+F) <div class='post-header-line-1'/> tag.

Copy below code and paste it directly below <div class='post-header-line-1'/> tag.

<b:if cond='data:blog.pageType == "item"'>

<table border='0' style='float:right; margin-left:5px;'><tr><td><img border='0' src='http://www.matrixar.com/-b1_J5npcUag/TdzJSK1mwdI/AAAAAAAAEFU/f7mZHFshlQI/s1600/font-size-blogger-gadget.png'/> | <a class='increaseFont' style='cursor: pointer; cursor: hand;' title='Larger Text'><img src='http://www.matrixar.com/-DP_25fJBGew/TdzJRS0KcJI/AAAAAAAAEFM/P9-ikZyu3UE/s1600/bigger-font+-+Copy.png'/></a>
<a class='decreaseFont' style='cursor: pointer; cursor: hand;' title='Smaller Text'><img src='http://www.matrixar.com/-9SuQUU3YZlI/TdzJTOokcLI/AAAAAAAAEFg/Nz8SeJ6-QIs/s1600/smaller-font.png' style='cursor: hand;'/></a>
<a class='resetFont' style='cursor: pointer; cursor: hand;' title='Reset Text Size'><img src='http://www.matrixar.com/-i-uGhNM_bks/TdzJScrNpII/AAAAAAAAEFY/v4XGHbR30Cw/s1600/reset-font.png' style='cursor: hand;'/></a></td></tr></table>

</b:if>

<!-- End Text re size gadget by www.www.matrixar.com –>