Random post widget for blogger
why to add this widget
This widget is not compulsory but it increase the beauty of blog and catch eye of viewer because it looks that text is moving behind mouse pointer.Also i want to tell you a new widget for blogger which also increase beauty and help to increase more click.Recent post widget for blogger
How to add flying letters below mouse cursor in blogger
Step1:login to blogger account and go to your blog
Step2:Go to layout and Add gadget of HTML/Javascript
Paste the given code there and save the gadget.
Note: In the above code replace welcome text with your text you want to appear on your blog.
visit you blog to confirm that animated letters appear on your blog while moving cursor.
To change color of text change #008BDB in above code with your color code.
Here there is few color code
Paste the given code there and save the gadget.
<!--flying text widget start-->
<style type='text/css'>
#animlekha {
font-style: italic;
font-weight: normal;
font-family: 'Oswald', sans-serif;
color: #008BDB;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#animlekha div {position: relative;}
#animlekha div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<script type='text/javascript'>
//<![CDATA[
;(function(){
// ===== Script Start =====//
// Enter the desired sentence
var msg = "Welcome text";
// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 25;
// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;
// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;
var diameter = 5;
// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var speed = 0.3;
var rotation = 0.2;
// ===== Script Finish by http://5gblogger.blogspot.com =====//
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement :
document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) +
'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'animlekha'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
//]]>
</script>
<!--flying text widget ends-->
Note: In the above code replace welcome text with your text you want to appear on your blog.
visit you blog to confirm that animated letters appear on your blog while moving cursor.
To change color of text change #008BDB in above code with your color code.
Here there is few color code
green #9acd32
blue #3c69ff
red #d73a31
Also Add stylish search box in your blog
I hope i work fine on your blog.Enjoy animated flying letter in blogger if you have any problem, you can contact me i will try my best to fix your problem.Also i would like to hear you thought and suggestion.