11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
Suite à une question sur les menus mobiles dans la section débutant du forum, Groumphy m'a indiqué ce lien:
http://www.editeurjavascript.com/scripts/scripts_navigation_1_117.php

Mon objectif est d'arriver à comprendre comment adapter ce script de façon à avoir un menu visuel (basé sur des images) qui puisse exploiter les mêmes fonctionnalités.
Je vous donne le code:
document.write('<style type="text/css">\nA.ejsmenu { color:#000000;text-decoration:none }\n</style>')
document.write('<DIV id=menu_dep STYLE="position:absolute; top:10; left:10"><TABLE BORDER=0 CELLPADDING=1 CELLSPACING=2 WIDTH=150>')
document.write('<TR><TD BGCOLOR=#000000 onMouseDown="testClick()" onMouseUp="testClick2()" ><FONT SIZE=2 face="Verdana" COLOR=#FFCC00><B>Menu</B></FONT></TD></TR>')
document.write('</TR></TABLE></DIV>')

clickOui = false;
bloc_x = 10;
bloc_y = 10;

function testClick() {
		base_x = x-bloc_x;
		base_y = y-bloc_y;
		clickOui=true;
	}
function testClick2() {
		clickOui=false;
	}


function get_mouse(e)
	{
	x = (navigator.appName.substring(0,3) == "Net") ? e.pageX : event.x+document.body.scrollLeft;
	y = (navigator.appName.substring(0,3) == "Net") ? e.pageY : event.y+document.body.scrollTop;
	if(clickOui && document.getElementById)
		{
		bloc_x = x-base_x;
		bloc_y = y-base_y;
		}
	document.getElementById("menu_dep").style.left = bloc_x
  	document.getElementById("menu_dep").style.top = bloc_y
	}
if(navigator.appName.substring(0,3) == "Net")
	document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = get_mouse;


De ce que j'en comprends, je n'ai aucune notion en JS, le partie à modifier se trouve au début du code, dans les "document.write"
De visu et naïvement, ces balises ressemblent étrangement à du HTML, puis-je m'imaginer q'en trouvant une forme de syntaxe adaptée en HTML je puisse modifier le contenu existant (menu textuel)??

Merci de m'avoir lu Smiley lol