PDA

View Full Version : Direction of stars - any help appreciated



lucretius
07-14-2007, 11:17 PM
Hi,

I am trying to edit a script to change direction of the stars.
http://www.dseffects.com/scriptsfx/DS_Stars/DS_Stars.html
Ideally I would like it to appear as though you were flying into them.

I must admit I am a complete amatuer to javascript so if anyone knows how i could achieve this I would be very thankful.

Heres the script...





<BODY BGCOLOR="#000000" onLoad="fly()">



<SCRIPT LANGUAGE="JavaScript">




<!-- Begin
SmallStars = 30;
LargeStars = 90;
SmallYpos = new Array();
SmallXpos = new Array();
LargeYpos = new Array();
LargeXpos = new Array();
Smallspeed= new Array();
Largespeed= new Array();
ns=(document.layers)?1:0;
if (ns) {
for (i = 0; i < SmallStars; i++) {
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0 BGCOLOR='#FFFFF0' CLIP='0,0,1,1'></LAYER>");
}
for (i = 0; i < LargeStars; i++) {
document.write("<LAYER NAME='ln"+i+"' LEFT=0 TOP=0 BGCOLOR='#FFFFFF' CLIP='0,0,2,2'></LAYER>");
}
}
else {
document.write('<div style="position:absolute;top:0px;left:0px">');
document.write('<div style="position:relative">');
for (i = 0; i < SmallStars; i++) {
document.write('<div id="si" style="position:absolute;top:0;left:0;width:1px;height:1px;background:#fffff0;font-size:1px"></div>');
}
document.write('</div>');
document.write('</div>');
document.write('<div style="position:absolute;top:0px;left:0px">');
document.write('<div style="position:relative">');
for (i = 0; i < LargeStars; i++) {
document.write('<div id="li" style="position:absolute;top:0;left:0;width:2px;height:2px;background:#ffffff;font-size:2px"></div>');
}
document.write('</div>');
document.write('</div>');
}
WinHeight = (document.layers)?window.innerHeight:window.document.body.clientHeight;
WinWidth = (document.layers)?window.innerWidth:window.document.body.clientWidth;
for (i = 0; i < SmallStars; i++) {
SmallYpos[i] = Math.round(Math.random() * WinHeight);
SmallXpos[i] = Math.round(Math.random() * WinWidth);
Smallspeed[i]= Math.random() * 5 + 1;
}
for (i = 0; i < LargeStars; i++) {
LargeYpos[i] = Math.round(Math.random() * WinHeight);
LargeXpos[i] = Math.round(Math.random() * WinWidth);
Largespeed[i] = Math.random() * 10 + 5;
}
function fly() {
var WinHeight = (document.layers)?window.innerHeight:window.document.body.clientHeight;
var WinWidth = (document.layers)?window.innerWidth:window.document.body.clientWidth;
var hscrll = (document.layers)?window.pageYOffset:document.body.scrollTop;
var wscrll = (document.layers)?window.pageXOffset:document.body.scrollLeft;
for (i = 0; i < LargeStars; i++) {
LargeXpos[i] -= Largespeed[i];
if (LargeXpos[i] < -10) {
LargeXpos[i] = WinWidth;
LargeYpos[i] = Math.round(Math.random() * WinHeight);
Largespeed[i] = Math.random() * 10 + 5;
}
if (ns) {
document.layers['ln'+i].left = LargeXpos[i];
document.layers['ln'+i].top = LargeYpos[i] + hscrll;
}
else {
li[i].style.pixelLeft = LargeXpos[i];
li[i].style.pixelTop = LargeYpos[i] + hscrll;
}
}
for (i = 0; i < SmallStars; i++) {
SmallXpos[i] -= Smallspeed[i];
if (SmallXpos[i] < -10) {
SmallXpos[i] = WinWidth;
SmallYpos[i] = Math.round(Math.random()*WinHeight);
Smallspeed[i] = Math.random() * 5 + 1;
}
if (ns) {
document.layers['sn'+i].left = SmallXpos[i];
document.layers['sn'+i].top = SmallYpos[i]+hscrll;
}
else {
si[i].style.pixelLeft = SmallXpos[i];
si[i].style.pixelTop = SmallYpos[i]+hscrll;
}
}
setTimeout('fly()', 10);
}
// End -->
</script>

<p><center>

</center><p>



Thanks in advace :)

ddadmin
07-14-2007, 11:25 PM
Is this a script on DD? If so, please include a link to the DD script in question in your post. See this thread (http://www.dynamicdrive.com/forums/showthread.php?t=6) for the proper posting format when asking a question.

jscheuer1
07-15-2007, 03:25 AM
http://www.maxxblade.co.uk/stars/index.htm

lucretius
07-15-2007, 03:31 PM
The thing is I like the other script as the stars are small and i would like to get luminous green text coming towards the viewer.

Does anyone know how to adapt the script to achieve this?

It's driving me up the wall :confused:

djr33
07-15-2007, 04:06 PM
Try using a negative number in the script for speed. That should, I'm guessing, make them go from left to right.

However, that's about all you can do.

It would be very difficult to change this script to make them like the starfield look you're going for. It would basically be rewriting all of the motion and generation.

lucretius
07-15-2007, 05:27 PM
Well after lots of looking and messing about I managed to come up with this.
It's a bit scrappy editing wise but it does what I needed it to do.

Thanks all for your help :)




<body bgcolor="#000000
" text="#FFFFFF" link="#FFFF00" vlink="#FFee00" alink="#FFFFFF">
<script language=JavaScript>
//Insert these lines at once after tag <body> (not in the other place).
//---- Choice of variables ----\\

numb_s=30 // - stars number (we have 20 ones).
speed_s=3 // - speed of movement of stars

//This and others free scripts you can find on a site: artdhtml.com
//The script works both with Internet Explorer (4-6) and with Netscape (4,6).

ns=document.layers?1:0
ie=document.all?1:0
ns6=document.getElementById&&!document.all?1:0
function moveSlide(name,sLeft, sTop) {
if (ns) {document.layers[name].top=sTop;document.layers[name].left=sLeft}
if (ie) {document.all[name].style.top=sTop;document.all[name].style.left=sLeft}
if (ns6) {document.getElementById(name).style.top=sTop;document.getElementById(name).style.left=sLeft}
}
function sizeSlide(name,sWdh, sHgt) {
if (ns){document.layers[name].clip.width=sWdh; document.layers[name].clip.height=sHgt}
if (ie){document.all[name].style.width=sWdh; document.all[name].style.height=sHgt}
if (ns6){document.getElementById(name).style.width=sWdh; document.getElementById(name).style.height=sHgt}
}
function positions(){
hei_scr=(ie)?window.document.body.clientHeight:window.innerHeight
wid_scr=(ie)?window.document.body.clientWidth:window.innerWidth-18
y_scrl=(ie)?document.body.scrollTop:window.pageYOffset
x_scrl=(ie)?document.body.scrollLeft:window.pageXOffset
}
posX=new Array()
posY=new Array()
posR=new Array()
radi=new Array()
tx=""
positions()
if (ns)
{
tx=tx+"<layer z-Index=100 left="+(wid_scr-35)+" top="+(hei_scr-35)+" ><a href='http://www.artdhtml.com'><img border=0 width=30 height=30 a></layer>"
}
else
{

}
for (i=0; i<numb_s;i++)
{
posY[i]=hei_scr/2
posX[i]=wid_scr/2
posR[i]=Math.random()*6.283
radi[i]=0
if (ns)
{
tx+="<layer z-Index=0 name=star_"+i+" left=0 top=0 width=1 height=1 bgColor=#ffffff></layer>"
}
else
{
document.write("<div id=star_"+i+" style='z-index:0; position:absolute; left:0;top:0;width:1;height:1;background:#ffffff'><img width=1 height=1></div>")
}
if(ns){document.write (tx);tx=""}
}
function go_stars(){
positions()
rad_max=Math.sqrt(wid_scr*wid_scr+hei_scr*hei_scr)/2
for (i=0; i < numb_s;i++){
rad=Math.sqrt(Math.pow((posY[i]-hei_scr/2),2)+Math.pow((posX[i]-wid_scr/2),2))/rad_max*4+1
posY[i]+=Math.round(Math.sin(posR[i])*rad*speed_s);
posX[i]+=Math.round(Math.cos(posR[i])*rad*speed_s);
if ((posX[i] > wid_scr-rad*2) || (posY[i] < 0 ) || (posY[i] > hei_scr-rad*2) || (posX[i] < 0))
{
posY[i]=hei_scr/2
posX[i]=wid_scr/2
posR[i]=Math.random()*6.283
sizeSlide("star_"+i,1,1)
moveSlide("star_"+i,posX[i]+x_scrl,posY[i]+y_scrl)
}
else{
if(Math.floor(rad)!=radi[i]){sizeSlide("star_"+i,rad,rad);radi[i]=rad}
moveSlide("star_"+i,posX[i]+x_scrl,posY[i]+y_scrl)
}
}
}
starSpeed=setInterval('go_stars()',15);

// end script


function ch_speed(new_speed){clearInterval(starSpeed); starSpeed=setInterval('go_stars()',new_speed);}

</script>
<layer z-Index=2>
<div style="position: relative">


<table border="0" cellpadding="4" cellspacing="0" width="100%" >
<tr>
<td>&nbsp;
<p>&nbsp;&nbsp;&nbsp;&nbsp;</p>
</td>
<td align="center">

<script src=../banners/serv4.htm></script>
</td>
<td></td>

</tr>
<tr>
<td></td>
<td valign="top" width="100%">&nbsp;
<p>&nbsp;</p>
<p>&nbsp;</p>


<p>&nbsp;</p>

<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<form method="POST" name=form_star action="1">