SIWEBST jQuery FALLING TEXT plugin
Our FALLING TEXT javascript /jQuery function animate the text content of a #divmove to #divbox, which is great for spice up your web pages.
We try to make it like real jQuery plugin .. but we are just stucked ... so is there anybody outhere for a nice help :)
BLOG: http://jquery-swsfall.blogspot.com/
DEMO: http://sws.dussan.org/
Here is ther code:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>SIWEBST jQuery FALLING TEXT plugin by A. Sisernik - Si Web Studio Team, Slovenia</title>
<meta name="keywords" content="SIWEBST jQuery FALLING TEXT plugin" />
<script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'></script>
<style>
body {
margin:0 auto;
width:100%;
height:100%;
font-size:12px;
font-weight:bold;
font-family:"Helvetica", sans-serif;
color: ORANGE;
text-align: center;
background: #111;
}
#divbox {
z-index:1000;
text-align:left;
position:absolute;
width:auto;
top:160px;
left:160px;
font-size:60px;
color:BLACK;
text-shadow: CYAN -1px -1px 0.7em;
font-family:"Impact", sans-serif;
font-weight:bold;
}
#divmove {
z-index:1000;
text-align:left;
position:fixed;
width:auto;
top:70%;
left:50%;
font-size:400px;
color:BLACK;
text-shadow: CYAN -1px -1px 0.7em;
font-family:"Impact", sans-serif;
font-weight:bold;
}
a:link {font-weight:bold; color:WHITE; text-decoration:none;}
a:hover {font-size:60px; font-weight:bold; color:BLACK; text-decoration:none; font-family:"Impact", sans-serif; text-shadow: CYAN -1px -1px 0.7em;}
</style>
<script>
var swsfallingtext = "S I W E B S T jQuery F A L I N G T E X T plugin :)"
var text = new Array();
text = swsfallingtext.split(' ');
function swsfall(loop) { var swstext = text[loop];
$('#divmove').html(swstext).animate({
top:160,
left: 160 + $('#divbox').width(),
fontSize:60 },400,
function(){
loop = loop + 1;
if(loop < text.length)
{$('#divbox').append(swstext).append(' '); swsfall(loop);}
else {$('#divmove').empty();$('#divbox').append(text[text.length-1]);}
}
).removeAttr('style');
}
</script>
</head>
<body onload="swsfall(0);">
<div id="divbox"></div>
<div id="divmove"></div>
<br>©2012 SIWEBST - Si Web Studio Team - Slovenia | <a href="mailto:siwebst.team@gmail.com"> SIWEBST E - mail</a>
</body>
</html>
Si Web Studio Team, Slovenia
------------------------------------------------------
SIWEBST & DDESIGN - when your web presentation becomes something special