newbie question and help please

**bm777** · 03-22-2010, 06:40 AM

HI All,

new to this, so please don't shoot me down in flames!! I need help in creating a script to "fade in" some text. All it has to do is to fade in say the word home and that's it, no looping, no repeating, etc. easy right?

I have searched but nothing even close..so any help would be greatly appreciated.

thanks in advance

gb

**Schmoopy** · 03-22-2010, 07:38 AM

If you want to do this with little effort, then using jquery might be an option.

Download it from here: http://jquery.com/

Save it in the same folder as the HTML file you want to fade in the text with.

Then make a test HTML page, and put the following in it:

Code:

<html>
<head>
<title>Fade In Text</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready( function() {
	$('#text').fadeIn(500);
});

</script>

<style type="text/css">
#text{
display:none;
}
</style>

</head>
<body>
<span id="text">Text you want to fade in</span>
</body>

</html>

Should do the trick. Not strictly valid HTML, but I know it works, should be able to go from there.

Good luck.

**bm777** · 03-22-2010, 09:11 PM

Hi Schmoopy and thank you for your reply..may I be a pest and ask one other little question please? font size, color and background color, where do I insert those variables?

thanks again for your patience

gb

**Schmoopy** · 03-22-2010, 09:56 PM

For those, you'll want to alter the CSS:

Code:

<html>
<head>
<title>Fade In Text</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready( function() {
	$('#text').fadeIn(500);
});

</script>

<style type="text/css">
#text{
display:none;
color:#FF0000;
font-size:24px;
background-color:#000000;
}
</style>

</head>
<body>
<span id="text">Text you want to fade in</span>
</body>

</html>

The above will make the text red, the background of the text black and the text size to be 24 pixels. Try something like http://www.colorpicker.com to choose a colour and replace the #XXXXXX bit with whatever colour you like.

**bm777** · 03-22-2010, 10:23 PM

HI Schmoopy, thanks again for the great help, and I have downloaded colorpicker. It looks like an indispensable tool to have and a great one too.

Thanks again for all the help and your patience

gb

**bm777** · 03-23-2010, 10:24 PM

I have tried to insert this code in a test web page and tried to validate it, but it returns errors:
"The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed)."

**BLiZZaRD** · 03-23-2010, 10:36 PM

Change:

Code:

<body>
<span id="text">Text you want to fade in</span>
</body>

to...

Code:

<body>
<div><span id="text">Text you want to fade in</span></div>
</body>

**Schmoopy** · 03-23-2010, 10:55 PM

I did say it wasn't valid HTML

**bm777** · 03-24-2010, 08:17 AM

Hahaha...marvellous, thanks guys, it works great...thank you for all your help and patience!!

gb

Thread: newbie question and help please

Thread Tools

Search Thread

newbie question and help please

Thank You

Bookmarks

Bookmarks

Posting Permissions