Animates Bubbles
Animates Bubbles
by edwardantony
HTML
<div class='tld' name="animate"><span>.com</span></div>
<div class='tld' name="animate"><span>.in</span></div>
<div class='tld' name="animate"><span>.us</span></div>
<div class='tld' name="animate"><span>.biz</span></div>
<div class='tld' name="animate"><span>.info</span></div>
<div class='tld' name="animate"><span>.co</span></div>
CSS
span{
color:#fff;
top:0px;
font-size:40px;
margin-left:10px;
line-height:80px;
text-align:center;
}
.tld {
width: 100px;
height:100px;
background-color:black;
position:fixed;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
-khtml-border-radius: 50%;
border-radius: 50%;
}
.tld:hover {
background-color:#BD0000;
}
}
JavaScript
(function() {
var e = jQuery,
f = "jQuery.pause",
d = 1,
b = e.fn.animate,
a = {};
function c() {
return new Date().getTime()
}
e.fn.animate = function(k, h, j, i) {
var g = e.speed(h, j, i);
g.complete = g.old;
return this.each(function() {
if (!this[f]) {
this[f] = d++
}
var l = e.extend({}, g);
b.apply(e(this), [k, e.extend({}, l)]);
a[this[f]] = {
run: true,
prop: k,
opt: l,
start: c(),
done: 0
}
})
};
e.fn.pause = function() {
return this.each(function() {
if (!this[f]) {
this[f] = d++
}
var g = a[this[f]];
if (g && g.run) {
g.done += c() - g.start;
if (g.done > g.opt.duration) {
delete a[this[f]]
} else {
e(this).stop();
g.run = false
}
}
})
};
e.fn.resume = function() {
return this.each(function() {
if (!this[f]) {
this[f] = d++
}
var g = a[this[f]];
if (g && !g.run) {
g.opt.duration -= g.done;
g.done = 0;
g.run = true;
g.start = c();
b.apply(e(this), [g.prop, e.extend({}, g.opt)])
}
})
}
})();
$(document).ready(function() {
animateDiv();
});
function makeNewPosition() {
// Get viewport dimensions (remove the dimension of the div)
var h = $(window).height() - 50;
var w = $(window).width() - 50;
var nh = Math.floor(Math.random() * h);
var nw = Math.floor(Math.random() * w);
return [nh, nw];
}
$(document).ready(function() {
$("div[name=animate]").each(function() {
...