Archief - Problemen met script in internet explorer

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.

brentg

Legacy Member
Hallo iedereen

Ik ben bezig met mijn website (heb ze al eens hier gezet)
In firefox en chrome werkt hij perfect, maar als ik hem in internet explorer open werkt het menu niet, dit menu is gedaan met javascript. link naar de website: BrentG

JS code:
Code:
//console
//DOM
var eMenu = document.getElementById("menu");
var eMainMenu = document.getElementById("mainMenu");
var eSubMenu = document.getElementById("subMenu");
var eMainItems = eMainMenu.getElementsByTagName("div");
var eSubItems = eSubMenu.getElementsByTagName("div");


//MouseOvers
eMainItems[0].onclick = function() 
{
	mHomeClick();
}
eMainItems[0].onmouseover = function() 
{
	mHome();
}
eMainItems[1].onmouseover = function() 
{
	mPers();
}
eMainItems[2].onmouseover = function() 
{
	mPro();
}
eMainItems[3].onmouseover = function() 
{
	mRecepten();
}
eMainItems[4].onmouseover = function() 
{
	mLinks();
}

eMainItems[4].onclick = function() 
{
	mLinksClick();
}

//menu related functions
function createSubMenuItem(text, script){
	//creating the elements
	var element = document.createElement("div");
	var eTitle = document.createTextNode(text);
	//modifying 
	element.setAttribute("class","menuSubItem");
	//script included?
	if (script)
	{
		//element.setAttribute("onclick","location.href = '"+link+"'"); obsolete
		element.setAttribute("onclick",script);
		console.info("Button " + text + " does: " + script);
	}	else {
		console.info("Button " + text + " has no script");
	}
	element.appendChild(eTitle);
	eSubMenu.appendChild(element);
}
function createSubMenuButton(imagePath, script, alt)
{
	//creating elements
	var blockElement = document.createElement("div");
	var imageElement = document.createElement("img");
	//modifying
	blockElement.setAttribute("class","menuSubItem");
	imageElement.setAttribute("class","imageButton");
	imageElement.setAttribute("src",imagePath);
	//script?
	if (script)	imageElement.setAttribute("onclick",script);
	if (alt) imageElement.setAttribute("onclick",alt);
	blockElement.appendChild(imageElement);
	eSubMenu.appendChild(blockElement);
}
function clean(node)
{
   var len = node.childNodes.length;

	while (node.hasChildNodes())
	{
	  node.removeChild(node.firstChild);
	}
}
//other functions
function setCookie(name, value, expirationdays){
	var expirationDate = new Date();
	expirationDate.setDate(expirationDate.getDate() + expirationdays);

	var cookieValue = value + "; expires="+expirationDate.toUTCString();
	document.cookie= name+" = "+cookieValue;

}
//menus
function mHomeClick()
{
	window.location.href="index.html";
}
function mHome()
{
	clean(eSubMenu);
	createSubMenuItem("comment","location.href = 'nl/comment.html'");
	createSubMenuItem("contact","location.href = 'nl/contact.html'");
}
function mPers()
{
	clean(eSubMenu);
	createSubMenuItem("bio","location.href = 'nl/biografie.html'");
	createSubMenuItem("hobby's","location.href = 'nl/hobby.html'");
	createSubMenuItem("sociaal","location.href = 'nl/sociaal.html'");
	
}
function mPro()
{
	clean(eSubMenu);
	createSubMenuItem("curriculum","location.href = 'nl/curriculum.html'");
	createSubMenuItem("online", "location.href = 'nl/online.html'");
	createSubMenuItem("coding","location.href = 'nl/coding.html'");
	createSubMenuItem("grafisch","location.href = 'nl/grafisch.html'");	
}

function mStandard()
{

}


function mRecepten()
{
	clean(eSubMenu);
	createSubMenuItem("koude gerechten","location.href = 'nl/koude_gerechten.html'");
	createSubMenuItem("warme gerechten","location.href = 'nl/warme_gerechten.html'");
	createSubMenuItem("desserts","location.href = 'nl/desserts.html'");
	
}

function mLinksClick()
{
	window.location.href="nl/links.html";
}

function mLinks()
{
	clean(eSubMenu);
}
//Subfunctions
function switchColor(sheet){
	setCookie("sheet",sheet,100);
	window.location.reload();
}

Html code van het menu:
HTML:
 <nav>
              <div class="mainMenu" id="mainMenu">&nbsp;
              <div class="menuItem">home</div>
              <div class="menuItem">persoonlijk</div>
              <div class="menuItem">portfolio</div>
              <div class="menuItem">recepten</div>
              <div class="menuItem">links</div>
            </div>
            <div class="subMenu" id="subMenu">&nbsp; </div>
          </nav>

-BVR-

Legacy Member
Ik veronderstel dat je dat niet zelf geschreven hebt?
Paar dingetjes:
- Zet je menu in ul's en li's.
- jQuery kan wat jij wilt waarschijnlijk korter schrijven
- Wat is het nut van én een ID én hetzelfde als class te gebruiken?

Neem eens een kijkje naar dit (simpeler maar logischer) voorbeeld: Edit this Fiddle - jsFiddle

EDIT: een beetje mooier gemaakt: http://jsfiddle.net/G45qr/2/

brentg

Legacy Member
BramVroy zei:
Ik veronderstel dat je dat niet zelf geschreven hebt?
Paar dingetjes:
- Zet je menu in ul's en li's.
- jQuery kan wat jij wilt waarschijnlijk korter schrijven
- Wat is het nut van én een ID én hetzelfde als class te gebruiken?

Neem eens een kijkje naar dit (simpeler maar logischer) voorbeeld: Edit this Fiddle - jsFiddle

EDIT: een beetje mooier gemaakt: Edit this Fiddle - jsFiddle

Ik heb het laatste deel geprobeerd, maar het lukt mij niet, het submenu blijft maar zichtbaar.
Ik heb de javascript en html van uit uw link gehaald en wat zitten aanpassen in de css.
Maar alvast bedankt al voor de moeite

P.S. sorry dat ik wat laat antwoord, maar had het wat druk met school de laatste dagen.

-BVR-

Legacy Member
Vergeeet jQuery niet te includen voor je script in je head..

Code:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

Scissor

Legacy Member
Wat me opvalt is dat je <nav> tags enzo gebruikt. Weet niet welke versie van IE je gebruikt, maar <nav> wordt enkel vanaf IE9 ondersteund. Mss handig om daar een HTML5 shim in te steken in combinatie met Modernizr voor oudere browser-gebruikers.

Als je Javascript gebruikt ook best het volgende gebruiken om eerst je pagina te laten laden en dan pas je script uit te voeren. Kan best sneller ook met jQuery, maar da's een eigen keuze natuurlijk. Tbh vind'k het gebruik van javascript in deze website beetje overbodig. Wat je wil doen kan je perfect met css en html.

window.onload = function ()
{
code
}

brentg

Legacy Member
BramVroy zei:
Vergeeet jQuery niet te includen voor je script in je head..

Code:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

Ok merci, dat wist ik nog niet (jQuery zie ik normaal gezien vanaf volgende week in de les ;) )


Scissor zei:
Wat me opvalt is dat je <nav> tags enzo gebruikt. Weet niet welke versie van IE je gebruikt, maar <nav> wordt enkel vanaf IE9 ondersteund. Mss handig om daar een HTML5 shim in te steken in combinatie met Modernizr voor oudere browser-gebruikers.

Als je Javascript gebruikt ook best het volgende gebruiken om eerst je pagina te laten laden en dan pas je script uit te voeren. Kan best sneller ook met jQuery, maar da's een eigen keuze natuurlijk. Tbh vind'k het gebruik van javascript in deze website beetje overbodig. Wat je wil doen kan je perfect met css en html.

window.onload = function ()
{
code
}

ik gebruik ie 9, en in mijn css staat er voor nav display: block; is dit voldoende?


Alvast bedankt, ik test het direct uit


PS weer sorry voor late antwoord ;)

-BVR-

Legacy Member
Ik weet nietwaarom ik zei dat je jQuery moest includen. Dat moet hier niet eens, toch niet dat ik zie op het eerste zicht.
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan