# Langer Quelltext in extra datei?



## Jonline (31. März 2005)

Hallo Zusammen.
Ich habe im internet einen Quelltext für ein Rightclick Menü gefunden.
Und da wollte ich ma fragen ob man diesen quelltext in einer extra datei schreiben kann, wie z.B. bei css. Aber ich glaube das es sich bei diesem Quelltext nicht um css handelt, bin mir aber nicht sicher.
Danke schonmal im vorraus.

Hier mal der Quelltext den ich auslagern möchte.

<STYLE> 
#contextMenu { 
  position: absolute; 
  visibility: hidden; 
  width: 120px; 
  background-color: lightgrey; 
  layer-background-color: lightgrey; 
  border: 2px outset white; 
} 

.A:Menu { 
   color: black; 
   text-decoration: none; 
  cursor: default; 
   width: 100% 
  } 

 .A:MenuOn { 
   color: white; 
   text-decoration: none; 
   background-color: darkblue; 
  cursor: default; 
   width: 100% 
  } 
</STYLE> 

<SCRIPT> 
var menu; 
function showMenu (evt) { 
  if (document.all) { 
    document.all.contextMenu.style.pixelLeft = event.clientX; 
    document.all.contextMenu.style.pixelTop = event.clientY; 
    document.all.contextMenu.style.visibility = 'visible'; 
    return false; 
  } 
  else if (document.layers) { 
    if (evt.which == 3) { 
      document.contextMenu.left = evt.x; 
      document.contextMenu.top = evt.y; 
      document.contextMenu.onmouseout = 
        function (evt) { this.visibility = 'hide'; }; 
      document.contextMenu.visibility = 'show'; 
      return false; 
    } 
  } 
  return true; 
} 
if (document.all) 
  document.oncontextmenu =showMenu; 
if (document.layers) { 
  document.captureEvents(Event.MOUSEDOWN); 
  document.onmousedown = showMenu; 
} 
</SCRIPT> 

<DIV ID="contextMenu" 
     ONMOUSEOUT="menu = this; this.tid = setTimeout 
('menu.style.visibility = \'hidden\'', 20);" 
     ONMOUSEOVER="clearTimeout(this.tid);" 
> 
&nbsp;<span style="color:#8D9CC0;font-size:14"><font face="Comic Sans Ms"><b><i>JS´s Homepage</i></b></font></span>
<hr>
<A HREF="index.html"; 
CLASS="menu" 
   ONMOUSEOVER="this.className = 'menuOn'" 
   ONMOUSEOUT="this.className = 'menu';" 
target=_parent> 
Startseite
</A> 
<br/> 
<A HREF="links.html"; CLASS="menu" 
   ONMOUSEOVER="this.className = 'menuOn'" 
   ONMOUSEOUT="this.className = 'menu';" 
target=_parent> 
Linkseite
</A> 
<br/>

<hr>
<a href="#"
onclick='window.location = "view-source:" + window.location.href'; CLASS="menu" 
   ONMOUSEOVER="this.className = 'menuOn'" 
   ONMOUSEOUT="this.className = 'menu';" 
> 
Quelltext
</A> 
</DIV>


----------



## Consti (31. März 2005)

Naja, das ist recht einfach!

Den CSS Block kannst du ja schon mal in eine Extra CSS Datei packen.
Den kannst du dann ja ganz normal im Header einbauen.

Naja, das andere kann man recht einfach mit PHP lösen. Dafür muss dein Webspace aber die PHP-Technik unterstüzen. Erkundige dich dazu am besten auf der HP deines Anbieters.
Falls das Webspacepaket eine PHP Unterstützung bietet, nimm den ganzen Teil, den du "rausnehmen" möchtest und pack diesen in eine neue Datei (zb. "scripts.php").
Anstatt des ganzen Blocks in der alten Datei schreibst du nun einfach:

```
<?php
include "scripts.php"; //ggf den Pfad relativ angleichen
?>
```
Schon ists fertig


----------



## Gumbo (31. März 2005)

contextmenu.js

```
var menu;
function showMenu (evt) {
	if (document.all) {
		document.all.contextMenu.style.pixelLeft = event.clientX;
		document.all.contextMenu.style.pixelTop = event.clientY;
		document.all.contextMenu.style.visibility = 'visible';
		return false;
	}
	else if (document.layers) {
		if (evt.which == 3) {
			document.contextMenu.left = evt.x;
			document.contextMenu.top = evt.y;
			document.contextMenu.onmouseout =
			function (evt) { this.visibility = 'hide'; };
			document.contextMenu.visibility = 'show';
			return false;
		}
	}
	return true;
}
if (document.all)
	document.oncontextmenu = showMenu;
if (document.layers) {
	document.captureEvents(Event.MOUSEDOWN);
	document.onmousedown = showMenu;
}
```
contextmenu.css

```
* {
	margin:			0;
	padding:		0;
	border-style:		none;
}
#contextMenu {
	position:		absolute;
	visibility:		hidden;
	padding:		0.1em;
	width:			8em;
	background-color:	ButtonFace;
	border:			1px solid ButtonShadow;
}
#contextMenu ul {
	list-style:		none;
	margin-top:		0.1em;
	padding-top:		0.1em;
	border-top:		1px ridge ThreeDLightShadow;
}
#contextMenu a:link,
#contextMenu a:visited {
	display:		block;
	width:			100%;
	padding:		0.1em 0.1em 0.1em 0.5em;
	color:			black;
	color:			MenuText;
	text-decoration:	none;
	cursor:			default;
}
#contextMenu a:link:hover,
#contextMenu a:visited:hover {
	color:			HighlightText;
	background-color:	Highlight;
}
#contextMenu .caption {
	padding:		0.1em 0.2em;
	color:			ActiveCaption;
}
```


```
<head>

	[…]
	<link rel="stylesheet" type="text/css" href="contextmenu.css">
	<script type="text/javascript" src="contextmenu.js"></script>
</head>

[…]

<div id="contextMenu" onmouseover="clearTimeout(this.tid);" onmouseout="menu = this; this.tid = setTimeout('menu.style.visibility = \'hidden\'', 20);">
	<p class="caption"><strong>JS’s Homepage</strong></p>
	<ul>
		<li><a href="index.html" target="_parent">Startseite</a></li>
		<li><a href="links.html" target="_parent">Linkseite</a></li>
	</ul>
	<ul>
		<li><a href="javascript:void(0)" onclick="window.location='view-source:' + window.location.href">Quelltext</a></li>
	</ul>
</div>
```


----------



## Jonline (31. März 2005)

Hey. Vielen Dank es funktioniert. 

Problem. 2
Kann mir jetzt noch jemand dabei helfen das wenn man das rightclick menü öffnet es immer komplett zu sehen ist. wie es beim windows standart ist. z.b. das wenn ich es in einem zukleinen frame für das menü öffne das es nicht dahinter verschwindet sondern komplett angezeigt wird.
Danke
mfg Jonline


----------

