HTML script voor matrix background - Softwareontwikkeling

vrijdag 29 juli 2005 00:14

Acties:

Verwijderd

Topicstarter

hiiii

ik probeer al paar uurtjes een script van Matrix achtergrond voor elkaar te krijgen maar ik kom er niet uit .

zou iemand mij daar kunnen mee helpen tanx.

http://scriptasylum.com/background/matrix/matrix.html
hier boven staan de instractions hoe je dat moet doen maar ik snap stap 2 helemaal niet en ik kan het niet werkend krijgen .

ik heb het script als volg

<html>
<head>
<title>Hunting</title>

</head>

[img]"C:/Documents[/img]

<body>

<html>

<basefont size="3" color="white"face="Georgia" >
 I dearly love to travel. I love life and going around to see different places.

 I love people and I love hanging out with my friends.

 There is always something great about every one and I try to see the best in them

 I'm all about respect and i cant stand liars.I want to travel all over and be happy....

<embed src="C:/Documents and Settings/sima kohzad/Desktop/website/muziek.wav" hidden="true" autostart="true" loop="true">

</body> </html>

</body>
</html>

tanx

vrijdag 29 juli 2005 00:17

Acties:

Reinier

\o/

Begin eens bij een basiscursus HTML, je HTML klopt helemaal niet...

vrijdag 29 juli 2005 00:34

Acties:

bredend

Ondanks dat je er geen recht op hebt:

HTML:

<html>
<head>
<title>Hunting</title>

<script language="javascript">
// MATRIX BACKGROUND ANIMATION
// By: BRIAN GOSSELIN OF http://scriptasylum.com
// V1.0
// Permission granted to use this script in your webpage provided the
// credit remain intact.

//GLYPH IMAGE FILE NAMES.
var glyphs=['p1.jpg','p2.jpg','p3.jpg','p4.jpg','p5.jpg','p6.jpg','p7.jpg','p8.jpg','p9.jpg','p10.jpg']; 

var glyphs_b=['p1b.jpg','p2b.jpg','p3b.jpg','p4b.jpg','p5b.jpg','p6b.jpg','p7b.jpg','p8b.jpg','p9b.jpg','p10b.jpg']; 


var glyphCount=400;      // TOTAL NUMBER OF GLYPHS.
var scrollSpeed=60;      // SPEED OF ANIMATION
var glyphD=15;           // GLYPH IMAGE WIDTH AND HEIGHT.
var disableColors=false; // SET TO true TO DISABLE THE "BRIGHTER" IMAGES (BETTER PREFORMANCE). SET TO false TO ENABLE THEM.

//************ DO NOT EDIT BEYOND HERE *************\\

var w3c=(document.getElementById)?true:false;
var ns4=(document.layers)?true:false;
var ie4=(document.all && !w3c)?true:false;
var ie5=(document.all && w3c)?true:false;
var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
var ids=new Array();
var wWidth, wHeight, colHeight;
var t='';
var counter=0;
var gx=new Array();
var ga=new Array();

for(i=0;i<glyphCount;i++){
gx[i]=Math.floor(Math.random()*glyphs.length);
t+=(ns4)?'<layer name="glyph'+i+'" top="-'+glyphD+'" left="0" width="'+glyphD+'" height="'+glyphD+'" z-index="1">':'<div id="glyph'+i+'" style="position:absolute; top:-'+glyphD+'px; left:0px; width:'+glyphD+'px; height:'+glyphD+'px; z-index:1">';
t+='[img]"'+glyphs[gx[i]]+'"[/img]';
t+=(ns4)?'</layer>':'</div>';
}
document.write(t);

for(i=0;i<glyphs.length;i++){
ga[i]=new Image();
ga[i].src=glyphs_b[i];
}

function matrixInit(){
getWindowDims();
for(i=0;i<glyphCount;i++){
ids[i]=(ns4)?document.layers['glyph'+i]:(ie4)?document.all['glyph'+i]:document.getElementById('glyph'+i);
ids[i].gx=gx[i];
}
gx='';
//setInterval('scrollGlyphs()',10*scrollSpeed);
scrollGlyphs();
}

function brighten(idnum,b){
if(ns4) ids[idnum].document.images['g'+idnum].src=(b)?glyphs_b[ids[idnum].gx]:glyphs[ids[idnum].gx];
else document.images['g'+idnum].src=(b)?glyphs_b[ids[idnum].gx]:glyphs[ids[idnum].gx];
}

function moveID(idnum,x,y){
var id=ids[idnum];
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}
if(!disableColors){
brighten(idnum,true);
setTimeout('brighten('+idnum+',false)',scrollSpeed*1.3);
}}

function getWindowDims(){
wWidth=(ie4||ie5)? document.body.clientWidth:window.innerWidth;
wHeight=(ie4||ie5)? document.body.clientHeight:window.innerHeight;
colHeight=Math.min(Math.floor(wHeight/1.5/glyphD)-1,25);
}

function scrollGlyphs(){
var sx=(ie4||ie5)? document.body.scrollLeft:window.pageXOffset;
var sy=(ie4||ie5)? document.body.scrollTop:window.pageYOffset;
var pixx=Math.floor(Math.random()*wWidth/(glyphD+1))*glyphD+sx;
var pixy=Math.floor(Math.random()*(wHeight-(colHeight*glyphD)))+sy;
for(i=0; i<colHeight; i++){
setTimeout('moveID('+counter+','+pixx+','+(pixy+glyphD*i)+')', scrollSpeed*i);
counter=((counter+colHeight)>glyphCount)?0:counter+1;
}
setTimeout('scrollGlyphs()', scrollSpeed*colHeight/2);
}

window.onload=matrixInit;
window.onresize=getWindowDims;
</script>








<style type="text/css">
.bodycontent{
position:absolute;
padding:20px;
top:10px;
left:10px;
width:100%;
color:white;
font-size:10pt;
font-family:helvetica;
z-index:2000;
}
</style>

</head>
<body>

<div class= bodycontent">
ALL YOUR HTML IN HERE, *EXCEPT* THE HTML THAT LOADS THE SCRIPT.
</div>


</body>
</html>

Nog ff de links naar de plaatjes bovenin het javascriptje aanpassen en het werkt leuk

vrijdag 29 juli 2005 08:28

Acties:

André

Analytics dude

Door bredend beb je het geluk dat je een werkend script krijgt maar in het vervolg zien we liever dat je zelf wat meer moeite doet en dat je aangeeft waar het precies fout gaat.

zaterdag 30 juli 2005 03:14

Acties:

Verwijderd

Topicstarter

hiii

bedankt bredend $_/-\o_$ voor je bijdrage ik zal je script goed bewaren want voor mij is het wel belangrijk . en aan alle andere mensen moet ik zeggen dat ik niet lang bezig ben met HTML en ik schaam me niet . ik had precies ook aangegeven dat ik stap 2 helemaal niet snapte . dusss shiiiiiiiiiiiiii

ik moet zeggen dat ik een zwarte gif file als background gebruik maar ik krijg alleen witte vierkantjes over background heen het lijkt alsof ik iets mis is met fonts ik weet niet of het daar door is of ik verkeerde background gebruik .

en ik zet de link van background boven <script language="javascript"> dus in lijn 4 doe ik het goed ?
moet ik andere fonts hebben? en heb goede background ? tanxx to all