Firefox reageert anders dan explorer

Status
Niet open voor verdere reacties.
R

Rene74

Nieuwe gebruiker
Lid geworden
8 apr 2008
Berichten
3
Beste mensen, graag leg ik jullie het volgende probleem voor.

Het menu van een testpagina op www.vivito.nl/gunsleben/index.html werkt goed in Explorer, maar niet goed in firefox. Ik kom er niet uit waar het probleem in zit.

Heeft een van jullie een idee?

Zie hieronder het script dat zorgt voor de werking van het menu:

PHP: 
/* Utility functions */
function addEvent(obj, evType, fn) {
  /* adds an eventListener for browsers which support it Written by Scott Andrew */
  if (obj.addEventListener) { obj.addEventListener(evType, fn, true); return true; }
  else if (obj.attachEvent) { var r = obj.attachEvent("on"+evType, fn); return r; }
  else { return false; }
}
function element(id) {
  var e = false;
  if (document.getElementById) { e = document.getElementById(id); }
  else if (document.all) { e = document.all(id); }
  return e;
}
// login
function toPassword(objOldInput) {
	var objNewElement = document.createElement('input');
	objNewElement.setAttribute('type', 'password');
    objNewElement.setAttribute('name', objOldInput.name);
	objOldInput.parentNode.replaceChild(objNewElement, objOldInput);
	toPassword.el = objNewElement;
	setTimeout('toPassword.el.focus()',100);
	return true;
}
// menu.js
function elementContains(elmOuter, elmInner) {
	while (elmInner && elmInner != elmOuter) { elmInner = elmInner.parentNode; }
	if (elmInner == elmOuter) {return true;}
	return false;
}
function getPageXY(elm) {
	var point = { x: 0, y: 0 };
	while (elm)	{
		point.x += elm.offsetLeft;
		point.y += elm.offsetTop;
		elm = elm.offsetParent;
	}
	return point;
}
function setPageXY(elm, x, y) {
	var parentXY = {x: 0, y: 0 };
	if (elm.offsetParent) { parentXY = getPageXY(elm.offsetParent); }
	elm.style.left = (x - parentXY.x) + 'px';
	elm.style.top  = (y - parentXY.y) + 'px';
}

function cssjsmenu(menuid, menutype) {
	// make the variables
	var i, j, node, child, parent, ul, li, deept, deeper, menudiv, version, offset;
	// if the browser doesn't even support document.getElementById, give up now.
	if (!document.getElementById) { return true; }
	offset = navigator.userAgent.indexOf('Opera');
	if (offset != -1) {
		version = parseInt('0' + navigator.userAgent.substr(offset + 6), 10);
		if (version < 7) { return true; }
	}
	offset = navigator.userAgent.indexOf('MSIE');
	if (offset != -1) { if (navigator.userAgent.indexOf('Mac') != -1) { return true; }}
	// horisontal or vertical menu
	var type = (menutype == 'vertical') ? 'vertical' : 'horisontal' ;
	// set the variables
	var deept = 0, deeper = false, ul = new Array(), li = new Array();
	menudiv = document.getElementById(menuid);
	// first ul (this is the horisontal head navigation)
	ul[deept] = new Array();
	for (i = 0; i < menudiv.childNodes.length; i++) {
		node = menudiv.childNodes[i];
		if (node.nodeName.toUpperCase() == 'UL') { ul[deept][ul[deept].length] = node; }
	}
	// first ul > li (this is the horisontal head navigation)
	li[deept] = new Array();
	for (i = 0; i < ul[deept].length; i++)	{
		node = ul[deept][i];
		for (j = 0; j < node.childNodes.length; j++) {
			child = node.childNodes[j];
			if (child.nodeName.toUpperCase() == 'LI') {	li[deept][li[deept].length] = child; }
		}
	}
	// if there are li's => go deeper (this is for the vertical sub navigations)
	if (li[deept].length > 0 ) deeper = true;
	for (deept=1; deeper==true; deept++) {
		var deeper = false;
		// deeper ul
		ul[deept] = new Array();
		for (i = 0; i < li[deept-1].length; i++) {
			node = li[deept-1][i];
			for (j = 0; j < node.childNodes.length; j++) {
				child = node.childNodes[j];
				if (child.nodeName.toUpperCase() == 'UL') {
					ul[deept][ul[deept].length] = child;
					// attach hover to parent li
					parent = child.parentNode;

					if (menuid == 'generalMenu') {
						if (deept > 1) {
							// onmouseover function
							parent.onmouseover = function (e) {
								var i, child, point;
								if (this.firstChild.nodeName.toUpperCase() == 'A') {
									if(this.firstChild.className.indexOf('active') != -1) { this.firstChild.className = 'active mouse'; }
									else { this.firstChild.className = 'mouse'; }
								}
								for (i = 0; i < this.childNodes.length; i++) {
									child = this.childNodes[i];
									if (child.nodeName.toUpperCase() == 'UL') {child.style.visibility = 'visible'; }
								}
								return false;
							};

							parent.onmouseout = function (e) {
								var relatedTarget = null;
								if (e) {
									relatedTarget = e.relatedTarget;
									/*work around Gecko Linux only bug where related target is null when clicking on menu links or when right clicking and moving into a context menu.*/
									if (navigator.product == 'Gecko' && navigator.platform.indexOf('Linux') != -1 && !relatedTarget) { relatedTarget = e.originalTarget; }
								}
								else if (window.event) { relatedTarget = window.event.toElement; }
								if (elementContains(this, relatedTarget)) { return false; }
								var i, child;
								for (i = 0; i < this.childNodes.length; i++) {
									child = this.childNodes[i];
									if (child.nodeName.toUpperCase() == 'UL') {	child.style.visibility = 'hidden';}
								}
								if (this.firstChild.nodeName.toUpperCase() == 'A') {
									if(this.firstChild.className.indexOf('active') != -1) { this.firstChild.className = 'active'; }
									else { this.firstChild.className = ''; }
								}
								return false;
							};
						}
					} else {
						// onmouseover function
						parent.onmouseover = function (e) {
							var i, child, point;
							if (this.firstChild.nodeName.toUpperCase() == 'A') {
								if(this.firstChild.className.indexOf('active') != -1) { this.firstChild.className = 'active mouse'; }
								else { this.firstChild.className = 'mouse'; }
							}
							for (i = 0; i < this.childNodes.length; i++) {
								child = this.childNodes[i];
								if (child.nodeName.toUpperCase() == 'UL') {child.style.visibility = 'visible'; }
							}
							return false;
						};
						// onmouseout function
						parent.onmouseout = function (e) {
							var relatedTarget = null;
							if (e) {
								relatedTarget = e.relatedTarget;
								/*work around Gecko Linux only bug where related target is null when clicking on menu links or when right clicking and moving into a context menu.*/
								if (navigator.product == 'Gecko' && navigator.platform.indexOf('Linux') != -1 && !relatedTarget) { relatedTarget = e.originalTarget; }
							}
							else if (window.event) { relatedTarget = window.event.toElement; }
							if (elementContains(this, relatedTarget)) { return false; }
							var i, child;
							for (i = 0; i < this.childNodes.length; i++) {
								child = this.childNodes[i];
								if (child.nodeName.toUpperCase() == 'UL') {	child.style.visibility = 'hidden';}
							}
							if (this.firstChild.nodeName.toUpperCase() == 'A') {
								if(this.firstChild.className.indexOf('active') != -1) { this.firstChild.className = 'active'; }
								else { this.firstChild.className = ''; }
							}
							return false;
						};
					}
				}
			}
		}
		// deeper ul > li
		li[deept] = new Array();
		for (i = 0; i < ul[deept].length; i++) {
			node = ul[deept][i];
			for (j = 0; j < node.childNodes.length; j++) {
				child = node.childNodes[j];
				if (child.nodeName.toUpperCase() == 'LI') {	li[deept][li[deept].length] = child; }
			}
		}
		// if there are li's => go deeper and do this lus again
		if (li[deept].length != 0) { deeper = true; }
	}
	return true;
}
function email_check(email_id,err_id){
	emailRegExp = /^[_a-zA-Z0-9-]+(\.[_a-zA-Z0-9-]+)*@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*(\.([a-zA-Z]){2,4})$/;
	var err_mail='Email addres incorrect!';
	if(emailRegExp.test(document.getElementById(email_id).value)){
		//alert('true');
		return true;
	}else{
		alert(err_mail);
		return false;
	}
}
/* Better(?) Image cross fader (C)2004 Patrick H. Lauke aka redux */
var	previousImage, currentImage, galleryImages, gallery, galleryId = 'photogallery'; /* general variables */
function preInit() { /* hide the image gallery list before even onload is triggered */
	if ((document.getElementById)&&(gallery=document.getElementById(galleryId))) {
		gallery.style.visibility = "hidden";
		clearTimeout(preInitTimer);
	} else { preInitTimer = setTimeout("preInit()",2); }
}
function fader(imageNumber,opacity) {
	var obj=galleryImages[imageNumber];
	if (obj.style.MozOpacity!=null) { obj.style.MozOpacity = (opacity/100) - .001; }
	else if (obj.style.opacity!=null) { obj.style.opacity = (opacity/100) - .001; }
	else if (obj.style.filter!=null) { obj.style.filter = "alpha(opacity="+opacity+")"; }
}
function fadeInit() {
	if (document.getElementById) { //preInit(); /* shouldn't be necessary, but IE can sometimes get ahead of itself and trigger fadeInit first */
		gallery=document.getElementById(galleryId);
		if(gallery){
			galleryImages = gallery.childNodes; /* get all child nodes... */
			for(i=0;i<galleryImages.length;i++) {
				galleryImages[i].style.position='absolute';
				galleryImages[i].style.top=0;
				galleryImages[i].style.zIndex=0;
				fader(i,0); /* set their opacity to transparent */
			}
			gallery.style.visibility = 'visible'; /* make the list visible again */
			currentImage=0; /* initialise a few parameters to get the cycle going */
			previousImage=galleryImages.length-1;
			opacity=100;
			fader(currentImage,100);
			window.setTimeout("crossfade(100)", 5000); /* start the whole crossfade process after a second's pause */
			return void(0);
		}
		else { return false; }
	}
	else { return false; }
}
function crossfade(opacity) {
    if (opacity < 101) {
        fader(currentImage,opacity);
        opacity += 5;
        window.setTimeout("crossfade("+opacity+")", 100);
    } else {
        fader(previousImage,0);
        previousImage=currentImage;
        currentImage+=1;
        if (currentImage>=galleryImages.length) { currentImage=0; }
        galleryImages[previousImage].style.zIndex = 0;
        galleryImages[currentImage].style.zIndex = 100;
        opacity=0;
        window.setTimeout("crossfade("+opacity+")", 5000);
    }
}
 
Laatst bewerkt door een moderator:
wat is precies het probleem... hoe moet het menuutje precies werken?

Het menu werkt helemaal niet in IE 6 en half in FF3
 
Laatst bewerkt:
Hoi Dicabrio,

Het betreft de mouse-overs (met de vlaggetjes). Het menu hoort bij eerste bezoek ingeklapt te zijn, zoals wel in IE 7.0. Onder 'over vivito' staat 1 klikpad uitgewerkt naar 'het landhuis'.

Bij firefox staat alles uitgeklapt, kan niet vinden waar dat aan ligt... Bedankt voor je tijd!
 
Je hebt ontzettend veel javascript gebruikt op dit moment terwijl dit volgens mij helemaal niet nodig is.

pas teneerste even je fouten aan in je html:
http://validator.w3.org/check?uri=h...(detect+automatically)&doctype=Inline&group=0

Ik zag dat je ook het volgende deed.
HTML: 
<div id="mainMenu"><ul class="mainMenu">
Waarom? met alleen
HTML: 
<ul id="mainMenu">
kom er ook of als je die div om layout redenen hebt dan:
HTML: 
<div id="mainMenu"><ul>
aanspreken:
Code: 
//css:
#mainMenu ul

daarnaast ben ik even gaan snoeien in je code. Je gebruik redelijk veel onnodige classes en ik heb even JS uitgezet. Het is namelijk ook haalbaar met alleen CSS, maar niet heus. IE6 gaat dan fout. Ik heb daarvoor ook een JSje toegevoegd zie de pagina..

http://test.robertcabri.nl/test/haar.html#

Het werkt nu in FF3 maar in safari en IE 6 doet ie gek. Kijk nog even goed naar je opbouw van je menu en je CSS. Ik heb het idee dat je meer gebruikt dan goed is
 
dicabrio, bedankt ik ga ermee verder. Wel lastig, na de aanpassingen werkt het idd weer niet in ie7 (en 6). Ik ga de codes eerst opschonen!
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan