Hi,
can anybody help me with this one please.
How can I make a glittering stars effect for my background?
Please help, TIA
M
12  12037 
"Miha Kovac" <mi*******@yahoo.com> schrieb im Newsbeitrag
news:WY********************@news.siol.net... Hi,
can anybody help me with this one please.
How can I make a glittering stars effect for my background?
Please help, TIA
M
Make an animated background gif.
--
Markus
Miha Kovac said:
Hi,
can anybody help me with this one please.
How can I make a glittering stars effect for my background?
Here's a fairly simple-minded Javascript implementation.
In practice, I would probably want to modify the script to
automatically place a specified (or random) number of stars,
would tweak the timing, and, of course, would use better
graphics:
<html>
<head>
<script type="text/javascript">
var starList=new Array();
var starState=new Array(3);
for(var i=0;i<starState.length;i++){
starState[i]=new Image(20,20);
starState[i].src="http://www.azphx.com/tmp/star"+i+".gif";
}
function twinkle(n){
starList[n].src=starState[Math.floor(Math.random()*3)].src;
setTimeout("twinkle("+n+")",Math.floor(Math.random ()*1000+500));
}
function init(){
var i=0;
var star;
var id="star"+((i<10)?"0":"")+i;
while(star=document.getElementById(id)){
starList[i]=star;
setTimeout("twinkle("+i+")",Math.floor(Math.random ()*1000+500));
i++;
id="star"+((i<10)?"0":"")+i;
}
}
</script>
</head>
<body onload="init()">
<div style="position:absolute;top:10px;left:10px"<img id="star00" src="star0.gif"></div>
<div style="position:absolute;top:10px;left:100px"<img id="star01" src="star0.gif"></div>
<div style="position:absolute;top:100px;left:100px"<img id="star02" src="star0.gif"></div>
<div style="position:absolute;top:30px;left:50px"<img id="star03" src="star0.gif"></div>
<div style="position:absolute;top:60px;left:40px"<img id="star04" src="star0.gif"></div>
</body>
</html>
I made a dhtml twinkle effect generator for some children several
months ago. You can use stars, text, or even flying pigs. The script
generated had to be kept simple and had to include document.all since
some had MSNTV that will not support getElementById. The scripts
generated thus work on IE and relatives as well as Opera, but not
Mozilla and Netscape. It would not be much trouble to extend the code
to include getElementById once you have generated a script you like.
See http://www.wtv-zone.com/cwdjrsxyz/to...generator.html .
"Miha Kovac" <mi*******@yahoo.com> schreef in bericht
news:WY********************@news.siol.net... Hi,
can anybody help me with this one please.
How can I make a glittering stars effect for my background?
Please help, TIA
M
By using this javascript you cam move your background. So make a glitter
jpg (or other) and put de script in your body.
<script language="JavaScript">
<!-- Begin
var backgroundOffset = 0;
var bgObject = eval('document.body');
function scrollBG(maxSize) {
backgroundOffset = backgroundOffset + 1;
if (backgroundOffset > maxSize) backgroundOffset = 0;
bgObject.style.backgroundPosition = "0 " + backgroundOffset;
}
var ScrollTimer = window.setInterval("scrollBG(307)", 64);
// End -->
</script>
Grtz, Remie
In article <bo**********@news.hccnet.nl>, "Remie en Roosje"
<re******@hotmail.com> writes: <script language="JavaScript">
language attribute is deprecated, use type="text/javascript" instead
<!-- Begin
Hiding scripts from the browser is no longer required, drop it. If you want to
comment the beginning, use a js comment instead.
var backgroundOffset = 0;
var bgObject = eval('document.body');
Why the unneeded use of eval to get a reference to the body?
Since you only call bgObject in one place, simply skip it and use the direct
reference there.
function scrollBG(maxSize) {
backgroundOffset = backgroundOffset + 1;
if (backgroundOffset > maxSize) backgroundOffset = 0;
bgObject.style.backgroundPosition = "0 " + backgroundOffset;
drop the above eval, and replace the above line with:
document.body.style.backgroundPosition = "0 " + backgroundOffset;
}
var ScrollTimer = window.setInterval("scrollBG(307)", 64);
// End -->
The closing HTML comment is unneeded.
</script>
--
Randy
"Remie en Roosje" <re******@hotmail.com> writes: By using this javascript you cam move your background. So make a glitter
jpg (or other) and put de script in your body.
Just because I can't let an "eval" go by uncommented ...
<script language="JavaScript">
In HTML 4 and forward, the type attribute is required (and the
language attribute is deprecated). The type attribute is also
backwards compatible, so there is no reason for not using
<script type="text/javascript">
<!-- Begin
HTML comments are not necessary in Javascript.
var backgroundOffset = 0;
var bgObject = eval('document.body');
This call to "eval" is completely spurious. Simply
var bgObject = document.body;
would be equivalent.
I have had problems with putting this code in the head element,
because the document.body doesn't exist yet at that point.
Since bgObject is only used once in the code, simply writing
document.body directly there would solve that problem.
function scrollBG(maxSize) {
backgroundOffset = backgroundOffset + 1;
if (backgroundOffset > maxSize) backgroundOffset = 0;
For purely esthetic reasons, I prefer the shorter lines
backgroundOffset++;
backgroundOffset %= maxSize;
I know that others want the more describing if statement,
so that's just a matter of style.
bgObject.style.backgroundPosition = "0 " + backgroundOffset;
To be correct CSS, the backgroundOffset should have a unit, most likely
pixels. I.e.,
bgObject.style.backgroundPosition = "0 " + backgroundOffset + "px";
The lacking "px" will make this code fail on some browsers in standards
compliant mode. Opera 7 seems to think that no unit means "em", giving
a much faster scroll than you want.
(The value "0" doesn't need a unit. However, I recommend giving it one
anyway, for consistency).
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
On 09 Nov 2003 12:39:51 +0100, Lasse Reichstein Nielsen
<lr*@hotpop.com> wrote: In HTML 4 and forward, the type attribute is required (and the
language attribute is deprecated).
There will be no more versions of HTML so deprecated has no meaning,
it has equivalent status as the type attribute...
The type attribute is also
backwards compatible, so there is no reason for not using
<script type="text/javascript">
Sure, this is to be prefered. <!-- Begin
HTML comments are not necessary in Javascript.
That's a javascript comment, not an HTML one, and it can cause no harm
(in XHTML things are different of course)
Jim.
--
comp.lang.javascript FAQ - http://jibbering.com/faq/ ji*@jibbering.com (Jim Ley) writes: On 09 Nov 2003 12:39:51 +0100, Lasse Reichstein Nielsen
<lr*@hotpop.com> wrote:
In HTML 4 and forward, the type attribute is required (and the
language attribute is deprecated).
There will be no more versions of HTML so deprecated has no meaning,
it has equivalent status as the type attribute...
Deprecated also means that it is absent in HTML 4 Strict. That is a
difference in status (maybe more to me than in general, since I always
(try to) write strict HTML)
I must admit that by "and forward", I was thinking of XHTML, which is
the logical sucessor to HTML. If you have a better way of saying the
same, I would be happy to use it :) <!-- Begin
HTML comments are not necessary in Javascript.
That's a javascript comment, not an HTML one, and it can cause no harm
(in XHTML things are different of course)
The string "<!--" begins an HTML comment. It is not part of ECMAScript
at all, and is not mentioned in the comments section of Netscape's
Javascript 1.5 reference (or 1.3 or 1.4, which have almost identical
wordings) .
<URL:http://devedge.netscape.com/library/manuals/2000/javascript/1.5/reference/comment.html#1066582>
To me, that means that it is not a Javascript comment. It is an HTML
comment that is accepted by the Javascript interpreters in browsers.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
On 09 Nov 2003 13:07:56 +0100, Lasse Reichstein Nielsen
<lr*@hotpop.com> wrote: ji*@jibbering.com (Jim Ley) writes:
On 09 Nov 2003 12:39:51 +0100, Lasse Reichstein Nielsen
<lr*@hotpop.com> wrote:
>In HTML 4 and forward, the type attribute is required (and the
>language attribute is deprecated).
There will be no more versions of HTML so deprecated has no meaning,
it has equivalent status as the type attribute...
Deprecated also means that it is absent in HTML 4 Strict. That is a
difference in status (maybe more to me than in general, since I always
(try to) write strict HTML)
Sure, not in strict is good, but deprecated is IMO irrelevant when
talking about HTML, there being no future HTML's...
I must admit that by "and forward", I was thinking of XHTML, which is
the logical sucessor to HTML.
Well, given that it has a different mime-type, I don't buy that, it's
a different beast (certainly in the same problem space, but it's not
the same thing.) That's a javascript comment, not an HTML one, and it can cause no harm
(in XHTML things are different of course)
The string "<!--" begins an HTML comment.
The content model of SCRIPT is CDATA - you're not allowed comments
inside it, therefore that must be part of the script, and passed to
the script engine. Certainly it's not part of ECMAScript, but that is
not an HTML comment - they're not legal inside SCRIPT blocks (this is
the change with XHTML of course where the content model of script
changed to PCDATA which allows comments.)
It's either a javascript comment, or something that the javascript
engine accepts as if it was a comment - it's passed as is via the HTML
parser.
Jim.
--
comp.lang.javascript FAQ - http://jibbering.com/faq/ ji*@jibbering.com (Jim Ley) writes: Well, given that it has a different mime-type, I don't buy that, it's
a different beast (certainly in the same problem space, but it's not
the same thing.)
It might have a different content type, but comparing HTML 4.01 and
XHTML 1.0, they have the same:
- tag names
- attribute names
- attribute values (except that they cannot be omitted)
- deprecated tags
- deprecated attributes
I would say that it is very much the same *thing*, just with a
slightly different *syntax*. I don't see HTML as only the syntax, but
also as the semantic content associated to each element type. The
content type only tells us the syntax.
If going from HTML 3 to HTML 4 was a step forward, then going from
HTML 4 to XHTML 1.0 is just a step to the left, but still on the same
path.
The content model of SCRIPT is CDATA - you're not allowed comments
inside it, therefore that must be part of the script, and passed to
the script engine.
Yes, it is not treated as an HTML comment starter. I will bet that the
author *intended* it as an HTML comment starter, though (as it would
have been in HTML 2, before the script tag was introduced). He wrote
an HTML comment, but did it in a place where it is not interpreted
as one.
(browsers actually break thier ECMAScript support by using <!-- as
an comment-to-end-of-line. Compare these two scripts:
---
var x = 1;
var y = false <! -- x;
alert(y)
---
and
---
var x = 1;
var y = false <!-- x;
alert(y)
---
The first gives true, the second false, even though whitespace
should be irrelevant between operators.)
Certainly it's not part of ECMAScript, but that is not an HTML
comment - they're not legal inside SCRIPT blocks (this is the change
with XHTML of course where the content model of script changed to
PCDATA which allows comments.)
I say that it is an HTML comment, but that it is incorrectly placed.
That might, technically, make it not an HTML comment, but then, just
as technically, the content of the script tag isn't ECMAScript/
Javascript either.
It's either a javascript comment, or something that the javascript
engine accepts as if it was a comment - it's passed as is via the HTML
parser.
That I can agree with that, and votes on the second option of the
"or".
So, a more correct complain would have been:
"You don't need the-token-normally-used-for-starting-HTML-comments in
Javscript"
If you have a shorter version that says the same, it would be great :)
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
On 09 Nov 2003 14:02:27 +0100, Lasse Reichstein Nielsen
<lr*@hotpop.com> wrote: ji*@jibbering.com (Jim Ley) writes:
Well, given that it has a different mime-type, I don't buy that, it's
a different beast (certainly in the same problem space, but it's not
the same thing.)
It might have a different content type,
I would say that it is very much the same *thing*, just with a
slightly different *syntax*.
No, forget the myth about XHTML 1.0
<script type="application/x-jim-script">
<!-- Jim --></script>
Means diferent things in HTML 4.01 and XHTML 1.0 - they are not the
same. (x-jim-script uses <!-- str --> the same as JS uses
document.write("str") - in HTML 4.01, it would write something, in
XHTML 1.0 it would not.)
I don't see HTML as only the syntax, but
also as the semantic content associated to each element type. The
content type only tells us the syntax.
It doesn't even tell us that, text/html - is tag soup parse it
however, in fact it's more the semantics of the element than the
syntax, seen as the incompatible HTML and XHTML syntaxes are both
labelled with the same type.
If going from HTML 3 to HTML 4 was a step forward, then going from
HTML 4 to XHTML 1.0 is just a step to the left, but still on the same
path.
I can't agree with this, they are syntactically and even in some cases
semantically different, the only thing they have in common is that
they both can be rendered by tag-soup slurpers.
Yes, it is not treated as an HTML comment starter. I will bet that the
author *intended* it as an HTML comment starter,
We can only assume that the author intended it to meet the document
they described it as, we can't assume the author is an idiot.
I say that it is an HTML comment, but that it is incorrectly placed.
If it was XHTML 1.0 as application/xhtml+xml it would be (and the
script MUST not be executed), if it's text/html it is not a comment,
it's part of the script - We either follow the standard, or we ignore
it...
That might, technically, make it not an HTML comment, but then, just
as technically, the content of the script tag isn't ECMAScript/
Javascript either.
Sure it is - as you noted javascript implementations consider <!-- to
be a single line comment, it's not core ecmascript, but you're free to
extend ecmascript however you want.
So, a more correct complain would have been:
"You don't need the-token-normally-used-for-starting-HTML-comments in
Javscript"
If you have a shorter version that says the same, it would be great :)
I'd not complain about it, it's perfectly safe, it's only a problem if
you choose to author XHTML 1.0, seen as that's such a difficult thing
to do, I'd stick with HTML 4.01, and leave it in (although in my
personal authoring I don't bother, but then other people include other
comments which I wouldn't bother about.
Jim.
--
comp.lang.javascript FAQ - http://jibbering.com/faq/ This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics | |
by: Markus Mohr |
last post by:
Hi, everyone,
I have a special problem:
For every monitor resolution in 200 pixel steps from 800 to 1600
pixels I have an image to be shown as centered background-image.
Those images all...
|
by: Peter Williams |
last post by:
Hi All,
I want to write some javascript for a html page which does the
following.
Imagine that the page contains a table with 2 columns and 3 rows, e.g.:
+---+---+
| A | B |
+---+---+
|
by: scorpion1 |
last post by:
:) hi i would would to make some kind of flashing stars appear on a form when a person reaches a certain qualification can someone posible help?
|
by: nicky77 |
last post by:
Hi, I've created a nav bar using a background image for rollover effects. Everything works as I had hoped, however, for some reason it seems that an area of whitespace (the same size of the...
|
by: darween |
last post by:
How To write a full program to ask the users to enter a number , which indicates the number / level of stars that he / she wishes to display
| | |
by: bs866806 |
last post by:
Why do many people look to movie stars for answers to some of life's
most challenging questions?
While we have great respect for the art of acting, as explicated from
Stanislavsky to Strasberg,...
|
by: aj2317 |
last post by:
how do i do shapes like diamond,right angled triangle etc using just *(stars) in nested for loop???? like
*
...
|
by: thephatp |
last post by:
I'm having a problem with IE rendering correctly. I'm experimenting with using all div's in my pages now, and I'm not very familiar with the quirks of IE.
I have created a sample page, and I'm...
|
by: deephill |
last post by:
hi thr,
i need Time based background image change script for website.
ex: if user open in moring time background with sunrise*
open in midday background vry bright*
open in the evng background...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
| | |
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
|
by: TSSRALBI |
last post by:
Hello
I'm a network technician in training and I need your help.
I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs.
The...
|
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| | |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence...
| |
