<!doctype html>
<html>
<head>
<title>jQuery Sheep Plugin</title>
<meta charset="UTF-8" />
<style type="text/css">
body {
background-color:#cecece;
}
h1,p {
text-align:center;
}
#main {
height:500px;
width:800px;
background-color:#ababab;
position:absolute;
left:50%;
margin-left:-400px;
}
.item {
width:150px;
height:75px;
background:blue;
border:10px solid green;
position:absolute;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script src="sheep.php/jquery.sheep.js" type="text/javascript"></script>
</head>
<body>
<h1>jQuery Sheep generator</h1>
<p>
A useless jQuery plugin to spawn noisy clickable sheeps<br />
and other animated gifs all around your boxes.<br />
Brought to you by <a target="_blank" href="https://twitter.com/intent/follow?original_referer=http%3A%2F%2Fphpsecure.info%2Fsheep.php®ion=follow_link&screen_name=TobozoTagada&tw_p=followbutton&variant=2.0">tobozo</a> (c+) 2013<br />
<a href="sheep.php/jquery.sheep.js">view plugin source</a>
</p>
<div id="main">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
<div style="margin-top:550px;text-align:center">
<a href="https://twitter.com/share" class="twitter-share-button" data-via="TobozoTagada">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
<div align="center">
<div style="white-space:pre;display:inline-block;text-align:center;font-size:10px;font-family:sans-serif;">
Credits :
- Tatsutoshi Nomura's 1994 'Sheep' for PC -
- Fuji Television Animation 'Stray Sheep Poe' -
- RIP Trivia Village Center, Inc : Streisand Effect -
- Gif Sprite : http://spritedatabase.net/file/12735 -
- Help file : http://mentadd.com/sheep/ -
- Microsoft Gif Animator (Gimp sucks eh) -
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
// this is only to give random
// positions to the example boxes
var w,h,tw,th,x,y,offset;
offset = $('#main').offset();
w = $('#main').width();
h = $('#main').height();
$('.item').each(function() {
tw = $(this).width();
th = $(this).height();
x = (w* Math.random()) - tw + (offset.left/2);
y = (h* Math.random()) + tw - offset.top;
$(this).css({top:y,left:x});
});
// Plugin usage is as simple as any jQuery selector
$('.item').sheep();
})
</script>
</body>
</html>
|
Download
