badboyxlr
21-03-2011, 06:55 PM
Ok, so for this tutorial you will need these 3 scripts (just past the code below into your html file).
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/jquery-1.5.js"></script>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/glow.js"></script>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/jquery.color.js"></script>
They will give us the base for the jQuery we are going to use.
The next step is the jQuery whitch will alow every element with the id of glow, to glow..
<script type="text/javascript">
var color="#ce0000";//color of glow
function glow(){
//jQuery
$(document).ready(function(){
$('#glow').glow({//.glow is given by the scripts above.
glowColor: color,//collour of glow in HEX or the name of the color, e.g. black
glow: true,
sparkle: true//optional
});
});
}
</script>
Next, we need to repeat this function over non stop.
<script type="text/javascript">
var speed=2;//seconds
var int=speed*1000;//put speed into milliseconds
setInterval(glow, int);//repeat the function "glow" on elements with #glow
</script>
Finlay put out an element with the #glow id.
<div id="glow">This is glowing text</div>
Click here (http://www.aidantaylor.net/html/glow.html) for working example.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Glow</title>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/jquery-1.5.js"></script>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/glow.js"></script>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/jquery.color.js"></script>
<script type="text/javascript">
var speed=2;//seconds
var color="#ce0000";//color of glow
function glow(){$(document).ready(function(){$('#glow').glo w({glowColor: color,glow : true,sparkle : true});});}$(document).ready(function(){$('#glow') .glow({glowColor: '#ce0000',glow : true,sparkle : true});});var int=speed*1000;setInterval(glow, int);
</script>
</head>
<body>
<p id="glow">Glowing text</p>
</body>
</html>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/jquery-1.5.js"></script>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/glow.js"></script>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/jquery.color.js"></script>
They will give us the base for the jQuery we are going to use.
The next step is the jQuery whitch will alow every element with the id of glow, to glow..
<script type="text/javascript">
var color="#ce0000";//color of glow
function glow(){
//jQuery
$(document).ready(function(){
$('#glow').glow({//.glow is given by the scripts above.
glowColor: color,//collour of glow in HEX or the name of the color, e.g. black
glow: true,
sparkle: true//optional
});
});
}
</script>
Next, we need to repeat this function over non stop.
<script type="text/javascript">
var speed=2;//seconds
var int=speed*1000;//put speed into milliseconds
setInterval(glow, int);//repeat the function "glow" on elements with #glow
</script>
Finlay put out an element with the #glow id.
<div id="glow">This is glowing text</div>
Click here (http://www.aidantaylor.net/html/glow.html) for working example.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Glow</title>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/jquery-1.5.js"></script>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/glow.js"></script>
<script type="text/javascript" src="http://www.aidantaylor.net/javascript/jquery.color.js"></script>
<script type="text/javascript">
var speed=2;//seconds
var color="#ce0000";//color of glow
function glow(){$(document).ready(function(){$('#glow').glo w({glowColor: color,glow : true,sparkle : true});});}$(document).ready(function(){$('#glow') .glow({glowColor: '#ce0000',glow : true,sparkle : true});});var int=speed*1000;setInterval(glow, int);
</script>
</head>
<body>
<p id="glow">Glowing text</p>
</body>
</html>