Hoppa till innehåll

Speciellt Program

Skinnpytte

Av Skinnpytte,
i Grafik & Programmering

 Dela

Rekommendera inlägg

TechnoX Newbie

TechnoX

Skrivet
Skrivet (redigerat)

Klistra in detta mellan <BODY> och </BODY>.

 

<STYLE TYPE="text/css">
<!--
/* Don't remove this line: Script by Omid Rouhani from JavaScript.nu */
/*
För varje meny ska du ha en "menyX-rad" och en "undermenyX-rad" i detta format:
#meny1	{position:absolute; visibility:hidden;}
#undermeny1 {position:absolute; visibility:hidden;}

Exempel:
* Ska du ha tre menyer, ändra inget nedan.
* Ska du bara ha två menyer, ta bort raderna nedan som börjar på #meny3 och #undermeny3.
* Ska du ha fyra menyer lägger du till två rader som börjar med #meny4 och #undermeny4.
* etc.
*/

#meny1	{position:absolute; visibility:hidden;}
#undermeny1 {position:absolute; visibility:hidden;}

#meny2	{position:absolute; visibility:hidden;}
#undermeny2 {position:absolute; visibility:hidden;}

#meny3	{position:absolute; visibility:hidden;}
#undermeny3 {position:absolute; visibility:hidden;}


/*	Nedan väljer du hur rubrikerna och länkarna ska se ut (t.ex. textfärg):	*/
/* Menyer vanligt: */			.menyRubrikClass {font-family:arial,verdana; text-decoration:none; color:darkblue; font-weight:bold; cursor:default}
/* Menyer då musen är på dem: */	.menyRubrikClass:hover {font-family:arial,verdana; text-decoration:none; color:darkblue; font-weight:bold; cursor:default}
/* Menyer då man besökt dem: */	.menyRubrikClass:visited {font-family:arial,verdana; text-decoration:none; color:darkblue; font-weight:bold; cursor:default}
/* Menyer då man trycker på dem: */	.menyRubrikClass:active {font-family:arial,verdana; text-decoration:none; color:darkblue; font-weight:bold; cursor:default}
/* Länkar vanligt: */			.menyLankClass {font-family:arial,verdana; text-decoration:none; color:blue;}
/* Länkar då musen är på dem: */	.menyLankClass:hover {font-family:arial,verdana; text-decoration:none; color:yellow;}
/* Länkar då man besökt dem: */	.menyLankClass:visited {font-family:arial,verdana; text-decoration:none; color:red;}
/* Länkar då man trycker på dem: */	.menyLankClass:active {font-family:arial,verdana; text-decoration:none; color:orange;}
//-->
</STYLE>


<script LANGUAGE="javascript">
<!--This is one of many scripts which are available at:     *---
//--http://www.JavaScript.nu/javascript                     *---
//--This script is FREE, but you MUST let these lines       *---
//--remain if you use this script.                          *---


//***---Lagrets placering räknat från översta vänstra hörnet:
pixelNer=0;
pixelVanster=0;   //Om du vill centrera sidan så strunta i att ändra denna

//***---Vill du inte centrera menyn skriver du "nej" på båda dessa. Vill du ha menyn centrerad på sidan så skriver du "ja" på NÅGON av dessa (dock inte båda). Du kan välja att centrera i förhållande till besökarens skärmstorlek eller i förhållande till den faktiska storleken sidan fått i webbläsaren (man tar alltså hänsyn till om det finns frames eller om besökaren t.ex. inte har webbläsaren maximerad). Troligtvis så vill du centrera i förhållande till webbläsarstorleken.
skaVaraCentreradIForhallandeTillSkarmstorlek="nej";
skaVaraCentreradIForhallandeTillWebblasarstorlek="nej";

//***---Rubrikernas storlek i bredd och höjd.
lagerBredd=150;
lagerHojd=20;

//***---Ändra inte dessa värden om du inte vet vad du gör!!! Dessa är namnen på DIV-elementen men ska inte ändras om du absolut inte måste (och då bara om du vet vad du håller på med)!
lagernamn="meny";			//dina menyers lager ska alltså heta "meny1", "meny2" etc.
lagernamn2="undermeny";		//de menyer som sedan poppar fram ska heta "undermeny1", "undermeny2" etc.

//***---"rubrikFarg" är färgen på det som man drar musen över för att en ny meny ska visas och "menyerFarg" är färgen på det fält där länkarna finns.
rubrikFarg="silver";
menyerFarg="silver";

//***---Detta fungerar endast med Explorer 4 och uppåt: Menyerna ändrar färg när musen dras över dem, välj färg här.
menyerFargMedMus="#cccccc";

//***---Så här många millisekunder ska det ta från det att musen dras från lagret tills lagret dras in. OBS: För Netscape är det lite kinkigare än för explorer, så jag rekommenderar inte att värdet är lägre än 400, även om det fungerar fint i Explorer med mindre än 400 kan Netscapeanvändare med ett lägre värde av misstag få menyn borttagen bara för att musen råkar åka en bit bort från själva länkarna.
stangInterval=400;

//***---Länkarna ska öppnas i vilken frame? Detta är samma som TARGET="x"
popupmenyTarget="_self";	//"_top", "_self", "_blank", "framensNamn" kan anges.

//***---Nu till det roliga, bestäm vilka rubriker som ska finnas med. Ha med hur många som helst.
rubriker=new Array("Om oss","Vänner","Övriga länkar");


//***---Ha med länkarna som ska finnas med under var rubrik. Du bestämmer givetvis både vart länken ska gå och vad texten man ska trycka på ska vara. Har du fler/färre menyer än fem stycken är det bara att lägga till/ta bort rader nedan så att du får så många som du ska ha menyer.
meny1rubriker=new Array("Vår policy",	"Företaget");
meny1lankar=new Array(	"policy.html",	"foretag.html");

meny2rubriker=new Array("Kalle Anka",	"Musse Pigg");
meny2lankar=new Array(	"kalle.html",	"musse.html");

meny3rubriker=new Array("Altavista",		"JavaScript.nu",		"Netscape");
meny3lankar=new Array(  "http://www.av.com/",	"http://www.JavaScript.nu/",	"http://www.netscape.com/");





//***---Detta ska INTE ändras!!! Låt raden nedan förbli omodifierad. Sätts 'varningFrameSaknas' till en tom sträng så varnar inte scriptet om den inte hittar den frame som anges i 'popupmenyTarget' ovan.
varningFrameSaknas="Framen '"+popupmenyTarget+"' hittas inte av scriptet.\nKontrollera stavningen av '"+popupmenyTarget+"' och se till så att du inte använder dig av frames i frames.\nScriptet klarar inte av frames i frames.\nInga garantier ges för att scriptet kommer att fungera som det ska nu!\nTrolig åtgärd som löser problemet: Ändra värdet på variabeln 'popupmenyTarget' i scriptet.\nÄndra värdet till ett framenamn som finns eller till t.ex. '_self'"


// ###########################################################################
// ################ÄNDRA INGET NEDAN OM DU INTE VET VAD DU GÖR################
// ###########################################################################

styleForTDelement="";
if (document.all)
{
styleForTDelement="STYLE=\"cursor: hand\"";
}

antalLager=rubriker.length;


webblasarnamn=navigator.appName;
if (skaVaraCentreradIForhallandeTillWebblasarstorlek=="ja" ||
   skaVaraCentreradIForhallandeTillSkarmstorlek=="ja")
{
if (navigator.userAgent.toLowerCase().indexOf("opera")!=-1)
{
	if (skaVaraCentreradIForhallandeTillWebblasarstorlek=="ja")
	{
		widthTmp=window.innerWidth;
		heightTmp=document.body.clientHeight;
	}
	else if (skaVaraCentreradIForhallandeTillSkarmstorlek=="ja")
	{
		widthTmp=screen.width;
		heightTmp=screen.height;
	}
}
else if (webblasarnamn == "Netscape")
{
	if (skaVaraCentreradIForhallandeTillWebblasarstorlek=="ja")
	{
		widthTmp=window.innerWidth;
		heightTmp=window.innerHeight;
	}
	else if (skaVaraCentreradIForhallandeTillSkarmstorlek=="ja")
	{
		if(navigator.javaEnabled())
			{
			javaStuff=java.awt.Toolkit.getDefaultToolkit().getScreenSize()
			widthTmp=javaStuff.width;
			heightTmp=javaStuff.height;
		}
	}
}
else if (webblasarnamn == "Microsoft Internet Explorer")
{
	if (skaVaraCentreradIForhallandeTillWebblasarstorlek=="ja")
	{
		widthTmp=document.body.clientWidth;
		heightTmp=document.body.clientHeight;
	}
	else if (skaVaraCentreradIForhallandeTillSkarmstorlek=="ja")
	{
		widthTmp=screen.width;
		heightTmp=screen.height;
	}
}

pixelVanster=parseInt(widthTmp/2-lagerBredd*antalLager/2);
}

function skrivUtMenyer()
{
for (i=1; i<=antalLager; i++)
{
skrivUtDetta="";
skrivUtDetta+=("<DIV ID='"+lagernamn+""+i+"' onMouseOver=\"visaMeny('"+lagernamn2+""+i+"')\" onMouseOut=\"doljMenyTimer('"+lagernamn2+""+i+"')\">")
skrivUtDetta+=("<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=\""+lagerBredd+"\" HEIGHT=\""+lagerHojd+"\" BGCOLOR=\""+rubrikFarg+"\">");
skrivUtDetta+=("<TR><TD><A HREF=\"java script:void(0)\" onMouseOver=\"visaMeny('"+lagernamn2+""+i+"')\" onMouseOut=\"doljMenyTimer('"+lagernamn2+""+i+"')\" CLASS='menyRubrikClass'>"+rubriker[i-1]+"</A></TD></TR>");
skrivUtDetta+=("</TABLE></DIV>")

skrivUtDetta+=("<DIV ID='"+lagernamn2+""+i+"' onMouseOver=\"visaMeny('"+lagernamn2+""+i+"')\" onMouseOut=\"doljMenyTimer('"+lagernamn2+""+i+"')\">")
skrivUtDetta+=("<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=\""+lagerBredd+"\" BGCOLOR=\""+menyerFarg+"\">");
	antalUndermenyer=eval("meny"+i+"rubriker.length")
	for (j=0; j<antalUndermenyer; j++)
	{
		if (popupmenyTarget == "_self" || popupmenyTarget == "")
			skrivUtDetta+=("<TR><TD "+styleForTDelement+" onClick=\"self.location.href='"+eval("meny"+i+"lankar["+j+"]")+"'\" onMouseOver=\"this.style.backgroundColor='"+menyerFargMedMus+"'\" onMouseOut=\"this.style.backgroundColor=''\"><A HREF=\""+eval("meny"+i+"lankar["+j+"]")+"\" onMouseOver=\"visaMeny('"+lagernamn2+""+i+"')\" onMouseOut=\"doljMenyTimer('"+lagernamn2+""+i+"')\" CLASS='menyLankClass'>"+eval("meny"+i+"rubriker["+j+"]")+"</A></TD></TR>")
		else if (popupmenyTarget == "_blank")
			skrivUtDetta+=("<TR><TD "+styleForTDelement+" onClick=\"window.open('"+eval("meny"+i+"lankar["+j+"]")+"','newWindow');\" onMouseOver=\"this.style.backgroundColor='"+menyerFargMedMus+"'\" onMouseOut=\"this.style.backgroundColor=''\"><A TARGET=\"newWindow\" HREF=\""+eval("meny"+i+"lankar["+j+"]")+"\" onMouseOver=\"visaMeny('"+lagernamn2+""+i+"')\" onMouseOut=\"doljMenyTimer('"+lagernamn2+""+i+"')\" CLASS='menyLankClass'>"+eval("meny"+i+"rubriker["+j+"]")+"</A></TD></TR>")
		else if (popupmenyTarget == "_top")
			skrivUtDetta+=("<TR><TD "+styleForTDelement+" onClick=\"top.location.href='"+eval("meny"+i+"lankar["+j+"]")+"'\" onMouseOver=\"this.style.backgroundColor='"+menyerFargMedMus+"'\" onMouseOut=\"this.style.backgroundColor=''\"><A TARGET=\"_top\" HREF=\""+eval("meny"+i+"lankar["+j+"]")+"\" onMouseOver=\"visaMeny('"+lagernamn2+""+i+"')\" onMouseOut=\"doljMenyTimer('"+lagernamn2+""+i+"')\" CLASS='menyLankClass'>"+eval("meny"+i+"rubriker["+j+"]")+"</A></TD></TR>")
		else if ((typeof(eval("parent."+popupmenyTarget ))+"").toLowerCase().indexOf("object") != -1)	//Om framen (vars namn finns i popupmenyTarget) finns, så...
			skrivUtDetta+=("<TR><TD "+styleForTDelement+" onClick=\"parent."+popupmenyTarget+".location.href='"+eval("meny"+i+"lankar["+j+"]")+"'\" onMouseOver=\"this.style.backgroundColor='"+menyerFargMedMus+"'\" onMouseOut=\"this.style.backgroundColor=''\"><A TARGET=\""+popupmenyTarget+"\" HREF=\""+eval("meny"+i+"lankar["+j+"]")+"\" onMouseOver=\"visaMeny('"+lagernamn2+""+i+"')\" onMouseOut=\"doljMenyTimer('"+lagernamn2+""+i+"')\" CLASS='menyLankClass'>"+eval("meny"+i+"rubriker["+j+"]")+"</A></TD></TR>")
		else
		{
			if (varningFrameSaknas.length>0)
			{
				alert(varningFrameSaknas)
				varningFrameSaknas="";	//Så visas inte felet mer än en gång
			}
			skrivUtDetta+=("<TR><TD "+styleForTDelement+" onClick=\"parent."+popupmenyTarget+".location.href='"+eval("meny"+i+"lankar["+j+"]")+"'\" onMouseOver=\"this.style.backgroundColor='"+menyerFargMedMus+"'\" onMouseOut=\"this.style.backgroundColor=''\"><A TARGET=\""+popupmenyTarget+"\" HREF=\""+eval("meny"+i+"lankar["+j+"]")+"\" onMouseOver=\"visaMeny('"+lagernamn2+""+i+"')\" onMouseOut=\"doljMenyTimer('"+lagernamn2+""+i+"')\" CLASS='menyLankClass'>"+eval("meny"+i+"rubriker["+j+"]")+"</A></TD></TR>")	//Denna rad gör så att menyerna skrivs ut, trots att de troligtvis inte fungerar (vilket man meddelas om i så fall)
		}
	}
skrivUtDetta+=("</TABLE></DIV>")
document.write(skrivUtDetta);
}
}

function placeraMenyer()
{
for (i=1; i<=antalLager; i++)
{
	if (document.all)
	{
	lagerStart=document.all[lagernamn+i].style;
	}
	else if (document.layers)
	{
	lagerStart=document.layers[lagernamn+i];
	}
	else if (document.getElementById)
	{
	lagerStart=document.getElementById(lagernamn+i).style;
	}
lagerStart.width=lagerBredd
lagerStart.height=lagerHojd
lagerStart.top=pixelNer
lagerStart.left=pixelVanster+lagerBredd*(i-1);
lagerStart.visibility="visible";

	if (document.all)
	{
	lagerStart=document.all[lagernamn2+i].style;
	}
	else if (document.layers)
	{
	lagerStart=document.layers[lagernamn2+i];
	}
	else if (document.getElementById)
	{
	lagerStart=document.getElementById(lagernamn2+i).style;
	}
lagerStart.width=lagerBredd
lagerStart.top=pixelNer+lagerHojd
lagerStart.left=pixelVanster+lagerBredd*(i-1);
lagerStart.visibility="hidden";
}
}

function visaMeny(vilken)
{
doljAllaAndra(vilken);
skaDoljaMenyn=false;
	if (document.all)
	{
	lagerStart=document.all[vilken].style;
	}
	else if (document.layers)
	{
	lagerStart=document.layers[vilken];
	}
	else if (document.getElementById)
	{
	lagerStart=document.getElementById(vilken).style;
	}
lagerStart.visibility="visible";
}

function doljMenyTimer(vilken)
{
doljAllaAndra(vilken);
skaDoljaMenyn=true;
setTimeout("doljMeny('"+vilken+"')", stangInterval);
}

function doljMeny(vilken)
{
	if (document.all)
	{
	lagerStart=document.all[vilken].style;
	}
	else if (document.layers)
	{
	lagerStart=document.layers[vilken];
	}
	else if (document.getElementById)
	{
	lagerStart=document.getElementById(vilken).style;
	}

if (skaDoljaMenyn)
{
lagerStart.visibility="hidden";
}
}


function doljAllaAndra(vilken)
{
for (i=1; i<=antalLager; i++)
{
if (vilken!=lagernamn2+i)
{
	if (document.all)
	{
	lagerStart=document.all[lagernamn2+i].style;
	}
	else if (document.layers)
	{
	lagerStart=document.layers[lagernamn2+i];
	}
	else if (document.getElementById)
	{
	lagerStart=document.getElementById(lagernamn2+i).style;
	}
lagerStart.visibility="hidden";
}
}
}
if (parseInt(navigator.appVersion)>=4)
{
skrivUtMenyer();
placeraMenyer();
}
//-->
</SCRIPT>

 

...Lite långt kanske :P .

Fick scriptet från javascript.nu, Du kan ändra lite värden för att få det som du vill

Redigerat av TechnoX
Länk till kommentar
Dela på andra sajter

Gå med i konversationen

Du kan skriva nu och registrera dig senare. Om du har ett konto, logga in nu för att posta med ditt konto.

Gäst
Svara på det här ämnet...

×   Klistrade in som rich text.   Klistra in som vanlig text istället

  Endast 75 emojis är tillåtet.

×   Din länk har automatiskt inbäddats.   Visa som en länk istället

×   Ditt tidigare innehåll har återställts.   Rensa redigeraren

×   Du kan inte klistra in bilder direkt. Ladda upp eller infoga bilder från URL.

×
 Dela
Gå till ämneslistan
×
×
  • Skapa ny...

Copyright 2000-2024 Crownberry AB | Integritetspolicy