Site niet helemaal Mozilla compatible

Status
Niet open voor verdere reacties.

Bruce The Boss

Terugkerende gebruiker
Lid geworden
14 aug 2002
Berichten
1.945
Met de snelle opkomst van Mozilla firefox dient mijn site natuurlijk ook helemaal met hun compatible te zijn.

Dat is hij echter niet helemaal:

Als je kijkt naar DEZE link dan staat helemaal bovenin de slite show mooi gecentreerd maar in firefox staat hij naar links. En ik krijg het niet aangepast ......... :(

Dit script hoort hierbij:

// JavaScript Document
var Beeldbreedte=150;//breedte
var Beeldhoogte=90;//hoogte
var Rand=false;//wel of geen rand ( false or true )
var Randkleur="#404040";//kleur rand
var Snelheid=15;//snelheid
var Pauze=2500; // 1 seconde = 1000
var Verticaal=0;//horizontaal of vertikaal fotoboek ( 1 of 0 )

// plaats hieronder je afbeeldingen iedere foto is apart zelfs aan een link te koppelen

Afbeeldingen=new Array(
"../plaatjes/2.jpg","#",
"../plaatjes/1.jpg","#",
"../plaatjes/8.jpg","#",
"../plaatjes/5.jpg","#",
"../plaatjes/12.jpg","#",
"../plaatjes/11.jpg","#",
"../plaatjes/14.jpg","#",
"../plaatjes/13.jpg","#",
"../plaatjes/16.jpg","#",
"../plaatjes/15.jpg","#" // na de laatste foto geen komma meer plaatsen
);

// Hieronder niets meer wijzigen

var BLI,BMI,BRI,BTI,HOEK=0,AFBC=6,MAXB,RICHTING=1;
var B_MSz,HALT=false;AFBV=new Array(Afbeeldingen.length);

function fotoboek(){
if(document.getElementById){
for(i=0;i<Afbeeldingen.length;i+=2){
AFBV=new Image();AFBV.src=Afbeeldingen}
BoekDiv=document.getElementById("Boek");
BLI=document.createElement("img");BoekDiv.appendChild(BLI);
BRI=document.createElement("img");BoekDiv.appendChild(BRI);
BMI=document.createElement("img");BoekDiv.appendChild(BMI);
BLI.style.position=BMI.style.position=BRI.style.position="absolute";
BLI.style.zIndex=BRI.style.zIndex=0;BMI.style.zIndex=1;
BLI.style.top=(Verticaal?Beeldhoogte+1:0)+"px";
BLI.style.left=0+"px";
BMI.style.top=0+"px";
BMI.style.left=(Verticaal?0:Beeldbreedte+1)+"px";
BRI.style.top=0+"px";
BRI.style.left=(Verticaal?0:Beeldbreedte+1)+"px";
BLI.style.height=Beeldhoogte+"px";
BMI.style.height=Beeldhoogte+"px";
BRI.style.height=Beeldhoogte+"px";
BLI.style.width=Beeldbreedte+"px";
BMI.style.width=Beeldbreedte+"px";
BRI.style.width=Beeldbreedte+"px";
if(Rand){
BLI.style.borderStyle=BMI.style.borderStyle=BRI.style.borderStyle="solid";
BLI.style.borderWidth=1+"px";
BMI.style.borderWidth=1+"px";
BRI.style.borderWidth=1+"px";
BLI.style.borderColor=BMI.style.borderColor=BRI.style.borderColor=Randkleur}
BLI.src=AFBV[0].src;
BLI.lnk=Afbeeldingen[1];
BMI.src=AFBV[2].src;
BMI.lnk=Afbeeldingen[3];
BRI.src=AFBV[4].src;
BRI.lnk=Afbeeldingen[5];
BLI.onclick=BMI.onclick=BRI.onclick=HYPERLINK;
BLI.onmouseover=BMI.onmouseover=BRI.onmouseover=STOP;
BLI.onmouseout=BMI.onmouseout=BRI.onmouseout=START;
AFBEELDINGEN()}}

function AFBEELDINGEN(){
if(!HALT){
if(Verticaal){
B_MSz=Math.abs(Math.round(Math.cos(HOEK)*Beeldhoogte));
MidOffset=!RICHTING?Beeldhoogte+1:Beeldhoogte-B_MSz;
BMI.style.top=MidOffset+"px";
BMI.style.height=B_MSz+"px"}
else{B_MSz=Math.abs(Math.round(Math.cos(HOEK)*Beeldbreedte));
MidOffset=RICHTING?Beeldbreedte+1:Beeldbreedte-B_MSz;
BMI.style.left=MidOffset+"px";
BMI.style.width=B_MSz+"px"}
HOEK+=Snelheid/720*Math.PI;
if(HOEK>=Math.PI/2&&RICHTING){
RICHTING=0;
if(AFBC==Afbeeldingen.length)AFBC=0;
BMI.src=AFBV[AFBC].src;
BMI.lnk=Afbeeldingen[AFBC+1];
AFBC+=2}
if(HOEK>=Math.PI){
RICHTING=1;
BTI=BLI;
BLI=BMI;
BMI=BTI;
if(Verticaal)BMI.style.top=0+"px";
else BMI.style.left=Beeldbreedte+1+"px";
BMI.src=BRI.src;
BMI.lnk=BRI.lnk;

setTimeout("PAUZEREN()",Pauze)}
else setTimeout("AFBEELDINGEN()",50)}
else setTimeout("AFBEELDINGEN()",50)}

function PAUZEREN(){
if(AFBC==Afbeeldingen.length)AFBC=0;
BRI.src=AFBV[AFBC].src;
BRI.lnk=Afbeeldingen[AFBC+1];
BMI.style.zIndex=2;
BLI.style.zIndex=1;
HOEK=0;
AFBC+=2;
setTimeout("AFBEELDINGEN()",50)}

function HYPERLINK(){if(this.lnk)window.location.href=this.lnk}
function STOP(){HALT=true;this.style.cursor=this.lnk?"pointer":"default"}
function START(){HALT=false}



En het volgende probleem is DEZE link.

Helemaal bovenin moeten eigenlijk de onderstaande logos voorbij komen. Dit gebeurt dus wel bij de IE-explorer maar niet bij firefox (nu komt er helemaal niets)

Deze scripts horen daarbij:

// JavaScript Document
var picture = new Array()
picture[1]="plaatjes/links/heuslogo.jpg"
picture[4]="plaatjes/links/coppens.jpg"
picture[0]="plaatjes/links/astenhoflogo.JPG"
picture[3]="plaatjes/links/chvlogo.jpg"
picture[6]="plaatjes/links/pingologo.jpg"
picture[2]="plaatjes/links/Storteboom.JPG"
picture[5]="plaatjes/links/GPS-Nunspeet.JPG"

// plaatje zonder link is '#'
var pictureurl = new Array()
pictureurl[0]="http://www.astenhof.nl"
pictureurl[1]="http://www.deheusbrokkingkoudijs.nl"
pictureurl[2]="http://www.storteboom.nl"
pictureurl[3]="http://www.chv-lbb.nl/"
pictureurl[4]="http://www.coppensdiervoeding.nl"
pictureurl[5]="http://www.gps-nunspeet.nl"
pictureurl[6]="http://www.pingopoultry.nl"

var target_url="_blank"
var horizontal_pos=500
var vertical_pos=10
var x_slices=04
var pause=2

en

var imgpreload=new Array()
for (i=0;i<=picture.length;i++) {
imgpreload=new Image()
imgpreload.src=picture
}

var picturewidth
var pictureheight
var i_loop=0
var i_picture=0
var width_slice
var cliptop=0
var clipbottom
var i_clipright=1
var content=""
pause=pause*1000

function initiate() {
getcontent()
if (document.all) {
for (i=0;i<=x_slices;i++) {
var thisinners=eval("s"+i)
thisinners.innerHTML=content
var thiss=eval("document.all.s"+i+".style")
thiss.posLeft=horizontal_pos
thiss.posTop=vertical_pos
}
var thisspan = eval("document.all.s"+0)
picturewidth=thisspan.offsetWidth
pictureheight=thisspan.offsetHeight
width_slice=Math.ceil(picturewidth/x_slices)
clipbottom=pictureheight
document.all.whole.style.posLeft=horizontal_pos
document.all.whole.style.posTop=vertical_pos
i_picture++
openlamellar()
}
if (document.layers) {
for (i=0;i<=x_slices;i++) {
var thisinners=eval("document.s"+i+".document")
thisinners.write(content)
thisinners.close()
var thiss=eval("document.s"+i)
thiss.left=horizontal_pos
thiss.top=vertical_pos
}
var thisspan=eval("document.s"+0+".document")
picturewidth=thisspan.width
pictureheight=thisspan.height
width_slice=Math.ceil(picturewidth/x_slices)
clipbottom=pictureheight
document.whole.document.write(" ")
document.whole.document.close()
document.whole.left=horizontal_pos
document.whole.top=vertical_pos
i_picture++
openlamellarNN()
}
}

function openlamellar() {
clipleft=-width_slice
clipright=0
if (i_clipright<=width_slice) {
for (i=0;i<=x_slices;i++) {
var thiss=eval("document.all.s"+i+".style")
thiss.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
clipleft+=width_slice
clipright=clipleft+i_clipright
}
i_clipright++
var timer=setTimeout("openlamellar()",20)
}
else {
clearTimeout(timer)
whole.innerHTML=content
var timer=setTimeout("changepicture()",pause)
}
}

function openlamellarNN() {
clipleft=-width_slice
clipright=0
if (i_clipright<=width_slice) {
for (i=0;i<=x_slices;i++) {
var thiss=eval("document.s"+i)
thiss.clip.left=clipleft
thiss.clip.right=clipright
thiss.clip.top=cliptop
thiss.clip.bottom=clipbottom
clipleft+=width_slice
clipright=clipleft+i_clipright
}
i_clipright++
var timer=setTimeout("openlamellarNN()",20)
}
else {
clearTimeout(timer)
document.whole.document.write(content)
document.whole.document.close()
var timer=setTimeout("changepictureNN()",2000)
}
}


function getcontent() {
content="<a href="+pictureurl[i_picture]+" target="+target_url+">"
content+="<img src="+picture[i_picture]+" border=0>"
content+="</a>"
}

function changepicture() {
i_clipright=0
clipleft=0
clipright=0
for (i=0;i<=x_slices;i++) {
var thiss=eval("document.all.s"+i+".style")
thiss.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
}
if (i_picture>picture.length-1) {i_picture=0}
getcontent()

for (i=0;i<=x_slices;i++) {
var thisinners=eval("s"+i)
thisinners.innerHTML=content
}
i_picture++
openlamellar()
}

function changepictureNN() {
i_clipright=0
clipleft=0
clipright=0
for (i=0;i<=x_slices;i++) {
var thiss=eval("document.s"+i)
thiss.clip.left=clipleft
thiss.clip.right=clipright
thiss.clip.top=cliptop
thiss.clip.bottom=clipbottom
clipleft+=width_slice
clipright=clipleft+i_clipright
}
if (i_picture>picture.length-1) {i_picture=0}
getcontent()
for (i=0;i<=x_slices;i++) {
var thisinners=eval("document.s"+i+".document")
thisinners.write(content)
thisinners.close()
}
i_picture++
openlamellarNN()
}

document.write("<span id='whole' class='s'></span>")
for (i=0;i<=x_slices;i++) {
document.write("<span id='s"+i+"' class='s'></span>")
}
document.close()
window.onload=initiate


Wie weet raad ?
 
Heb je die java zelf in elkaar gezet?? no offense


Trouwens als je je website FF proof wilt hebben raad ik je aan eens naar de W3C te kijken, FF houdt zich daar nogal strak aan:

http://w3.org/

En ook de validator doet soms wonderen (al heb ik nog geen goede voor JS gevonden):

http://validator.w3.org/

Trouwens petje af hoor, je ziet niet veel webmasters die uit zichzelf hun site FF proof maken.......


Ik snap trouwens de ballen van JS dus verder kan ik je niet helpen.
 
Hoi,

Eerste probleem is denk ik opgelost als je de TD, waarin de slide-show staat, gaat centreren, dus daar moet je dan even
align="center" aan toevoegen.

Tweede probleem zou heel goed in het javascript kunnen zitten, dan werkt deze alleen in IE.

Om je pagina w3c gevalideerd te krijgen moet je iig in alle tags, zoals link en script, een type hebben staan om aan te geven wat voor script er komt of naar wat voor type bestand gelinkt wordt.

Succes :)
 
Eerste probleem is denk ik opgelost als je de TD, waarin de slide-show staat, gaat centreren, dus daar moet je dan even

Ik heb op diverse plekken align="center" toegevoegd maar het wil niet lukken. Kun je misschien aangeven waar jij denkt dat het moet worden toegevoegd. Ik denk dat het zo moet:

Code:
<td width="79%" valign="middle" [b]align="center"[/b] bgcolor="#606080">
					
<!-- kuiken uit ei -->
				               
<script src="../scripts/kuiken_uit_ei.js">
</script>
<center>
<div id="Boek" style="position:relative">
<img src="../plaatjes/transparant.gif" width="350" height="80">
</div>
</center>
<!-- einde -->
 
Volgens mij he, maar dat weet ik niet zeker, is het zo wel goed:

Code:
<td width="79%" valign="middle" align="center" bgcolor="#606080">


					

<!-- kuiken uit ei -->


				               

<script src="../scripts/kuiken_uit_ei.js">


</script>





<div id="Boek" style="position:relative">


<img src="../plaatjes/transparant.gif" width="350" height="80" align="center"  alt="plaatje">


</div>


>


<!-- einde -->
 
Geplaatst door Sitethief
Trouwens petje af hoor, je ziet niet veel webmasters die uit zichzelf hun site FF proof maken.......
Dan verdienen zij het niet om zichzelf webmaster te noemen.
 
En zolang ik dit probleem niet krijg opgelost wil ik mezelf ook nog geen webmaster noemen want het lukt niet met bovenstaande tip.

Jacco
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan