---
title: "css i js?!"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/70307-css-i-js"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "ironhead"
published: "2003-03-07T09:42:12.000Z"
updated: "2003-03-07T16:59:00.000Z"
replies: 12
views: 311
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/70307-css-i-js"
---

# css i js?!

## #1 — ironhead, 2003-03-07T09:42Z

Jag använder denna meny på en sida:
<http://www.dynamicdrive.com/dynamicindex1/sm/index.htm>

Tittar jag i "sample.htm" så finns det några style taggar och färgen på menyn styrs via javascript:

\<style\>
all.clsMenuItemNS, .clsMenuItemIE{text-decoration: none; font: bold 12px Arial; color: white; cursor: hand; z-index:100}
\#MainTable A:hover {color: yellow;}
\</style\>

\<script language="JavaScript"\>

var keepstatic=1 //specify whether menu should stay static 0=non static (works only in IE4+)
var menucolor="#CCCCCC" //specify menu color
var submenuwidth=150 //specify sub menus width

\</script\>
  

Jag skulle istället vilja separera den grafiska formateringen genom att använda en extern .css-fil...så att jag enkelt kan ändra utseende på menyn...går det att göra så att det blir möjligt?! i så fall hur?

Permalänk: https://www.webforum.nu/p/70307

## #2 — Jesper T, 2003-03-07T11:52Z

Ändra till detta i ditt stylesheet eller på sidan sample.htm:

```
 <style>
all.clsMenuItemNS, .clsMenuItemIE{text-decoration: none; font: bold 12px Arial; color: white; cursor: hand; z-index:100}
#MainTable A:hover {color: yellow;}
[b].menucolor{background-color:red;}[/b]
</style>
```

 
Ta bort detta på sidan sample.htm

```
var menucolor="#CCCCCC" //specify menu color
```

 
Under "function menu()" på sidan menu.js ändra detta:

```
 function Menu()
{
	this.className = "menucolor";
	//this.bgColor = "#CCCCCC";
```

På samma sida (menu.js) byt ut alla  **bgColor='"+this.bgColor+"'**  mot **class='"+this.className+"'** 

Klart!
Ps. Det skulle kanske vara smidigare att styra allt ifrån ett stylesheet så kommer du kunna plocka bort en del kod.

Permalänk: https://www.webforum.nu/p/969822

## #3 — ironhead, 2003-03-07T12:55Z

> Ps. Det skulle kanske vara smidigare att styra allt ifrån ett stylesheet så kommer du kunna plocka bort en del kod.

 

Det är ju det jag vill göra, men vet inte hur...

Permalänk: https://www.webforum.nu/p/969851

## #4 — Jesper T, 2003-03-07T13:36Z

vassego

Bilagor:

- [meny.zip](https://www.webforum.nu/a/1125.zip)

Permalänk: https://www.webforum.nu/p/969882

## #5 — ironhead, 2003-03-07T14:54Z

ååååh! Supernice!
1000-tack!!!  :birp 

 :p

Permalänk: https://www.webforum.nu/p/969980

## #6 — ironhead, 2003-03-07T15:05Z

Nu när jag ändå har så supernajsiga människor på tråden kan jag väl oxå passa på att fråga om nån vet hur man ändrar för att menyn inte skall rulla ner när man för musen över den, utan att man måste klicka en gång med vänster musknapp för att den skall expandera, men fortfarande rulla tillbaka när man tar bort musen från menyn.

Permalänk: https://www.webforum.nu/p/969995

## #7 — Peter S, 2003-03-07T15:20Z

```
...
if (n)
	{
		MENUitem += "<ilayer name="+idItem+">";
		MENUitem += "<a href='.' class=clsMenuItemNS [b]onclick[/b]=\"displaySubMenu('"+idItem+"')\" onclick=\"return false;\">";
		MENUitem += "|&nbsp;";
		MENUitem += text;
		MENUitem += "</a>";
		MENUitem += "</ilayer>";
	}

...
else
	{
		if (altLocation != null)
			MENUitem += "href='"+altLocation+"' ";
		else
			MENUitem += "href='.' ";
		MENUitem += "[b]onclick[/b]=\"displaySubMenu('"+idItem+"')\" ";
		MENUitem += "onclick=\"return false;\" "
	}
...
```

 :)

Permalänk: https://www.webforum.nu/p/970009

## #8 — ironhead, 2003-03-07T15:38Z

ööh! Det där funkade inte som jag ville....när jag klickar på ett val...skickas jag 1 steg tillbaka istället för att menyn skall rulla ut sig...

Permalänk: https://www.webforum.nu/p/970033

## #9 — Peter S, 2003-03-07T16:05Z

Hoppsan. Nu då?

```
...
	if (n)
	{
		MENUitem += "<ilayer name="+idItem+">";
		MENUitem += "<a href='.' class=clsMenuItemNS onclick=\"displaySubMenu('"+idItem+"'); return false\">";
		MENUitem += "|&nbsp;";
		MENUitem += text;
		MENUitem += "</a>";
		MENUitem += "</ilayer>";
	}
...
		else
		{
			if (altLocation != null)
				MENUitem += "href='"+altLocation+"' ";
			else
				MENUitem += "href='.' ";
			MENUitem += "onclick=\"displaySubMenu('"+idItem+"')\" ; return false";
		}
...
if (ie||ns6)
{
	document.body.onscroll=hideAll;
	document.body.onmousemove=updateIt;
}
```

 :)

Permalänk: https://www.webforum.nu/p/970060

## #10 — ironhead, 2003-03-07T16:19Z

Jag hinner se att menyn fäller ut sig, men den byter fortfarande sida....Hur kommer man runt det?

Permalänk: https://www.webforum.nu/p/970071

## #11 — Peter S, 2003-03-07T16:29Z

Då prövar vi igen  ;) 

```
	if (n)
	{
		MENUitem += "<ilayer name="+idItem+">";
		MENUitem += "<a href='javascript:void(0)' class=clsMenuItemNS onclick=\"displaySubMenu('"+idItem+"'); return false\">";
		MENUitem += "|&nbsp;";
		MENUitem += text;
		MENUitem += "</a>";
		MENUitem += "</ilayer>";
	}
...
		else
		{
			if (altLocation != null)
				MENUitem += "href='"+altLocation+"' ";
			else
				MENUitem += "href='javascript:void(0)' ";
			MENUitem += "onclick=\"displaySubMenu('"+idItem+"')\" ; return false";
		}
...
```

Notera att ordet "javascript" ovan inte skall ha några mellanslag.

 :)

Permalänk: https://www.webforum.nu/p/970081

## #12 — ironhead, 2003-03-07T16:57Z

oj oj oj!
Nu är jag imponerad!  :) 
Sånt tålamod och engagemang!!!
många bärs åt dig amigo  :birp

Permalänk: https://www.webforum.nu/p/970109

## #13 — Peter S, 2003-03-07T16:59Z

No problem.

Hoppas att det fungerar som du tänkt dig nu.

 :bire

Permalänk: https://www.webforum.nu/p/970110

---

Tråden på webben: https://www.webforum.nu/amne/javascript/70307-css-i-js
